2

React Native TextInputコンポーネントがあります。仮想キーボードを使用して、Enterキーを押すと、新しい行が作成されます。ハードウェアキーボード(USB OTGアダプタを使用してAndroid 6タブレットに接続)を使用する場合、Enterキー(キーボードの中央にある大きなキー)はテキストを変更しないため、TextInputはフォーカスを失います。リターンキー(一般的なキーボードの右側の小さなもの)は、新しい行を作成します。React Native TextInput:ハードウェアキーボードの改行なしEnter key

TextInputのは非常に基本的な設定です:

<TextInput multiline={true} /> 

私はreturnKeyType属性の異なる値を試してみましたが、それらのどれもが、新しい行を作成しません。何か不足していますか?

答えて

1

私は同じ問題に直面していたが、私のために働い以下:

returnKeyType='none' 
0

はそれを試してみてください!それはラインの真ん中でも動作します!

<TextInput 
        placeholder={I18n.t('enterContactQuery')} 

        value={this.state.query} 
        onChangeText={text => this.setState({ query: text, allowEditing: true })} 

        selection = {this.state.selection} 
        onSelectionChange={(event) => this.setState({ cursorPosition: event.nativeEvent.selection, selection: event.nativeEvent.selection, allowEditing: true })} 
        onSubmitEditing={() => { 
        const { query, cursorPosition } = this.state; 
        let newText = query; 
        const ar = newText.split(''); 
        ar.splice(cursorPosition.start, 0, '\n'); 
        newText = ar.join(''); 
        if (cursorPosition.start === query.length && query.endsWith('\n')) { 
         this.setState({ query: newText }); 
        } else if (this.state.allowEditing) { 
         this.setState({ 
         query: newText, 
         selection: { 
          start: cursorPosition.start + 1, 
          end: cursorPosition.end + 1 
         }, 
         allowEditing: !this.state.allowEditing 
         }); 
        } 
        }} 
        multiline = {true} 
        numberOfLines = {10} 
        blurOnSubmit={false} 
        editable={true} 
        // clearButtonMode="while-editing" 
       /> 

constructor(props) { 
super(props); 
this.state = { 
    query: '', 
    cursorPosition: [0,0], 
    selection: null, 
    allowEditing: true 
} 

}

関連する問題