React Native TextInput:不带硬件键盘的换行输入键
问题描述:
我们的应用程序中有一个React Native TextInput组件。使用虚拟键盘,按Enter键创建一个新行。如果我们使用硬件键盘(使用USB OTG适配器连接到Android 6平板电脑),Enter键(键盘中间的大键盘)不会更改文本,但TextInput只会失去焦点。 Return键(普通键盘右侧较小的一个)创建一个新行。React Native TextInput:不带硬件键盘的换行输入键
了TextInput是设置非常简单:
<TextInput multiline={true} />
我尝试了不同的值的returnKeyType属性,但它们都没有建立新行。我错过了什么吗?
答
我面临同样的问题,但对我下面的工作:
returnKeyType='none'
答
试试吧!它也在线的中间工作!
<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
}
}