我试图从TextInput获取值,但如果我使用onChangeText
,键盘将立即崩溃,因此用户无法在输入中写入。
但是,如果我使用onChange
和preventDefault
,我仍然无法从输入中获取文字,因此this.state.userSearch
为空
class CustomName extends React.Component {
constructor(...args) {
super(...args);
this.state = {
userSearch: ""
};
}
renderSearchInput() {
if (this.state.search) {
return (
<View style={styles.outerContainer}>
<TextInput
style={[
styles.textInput,
{ height: Platform.OS == "android" ? 40 : 20 }
]}
underlineColorAndroid="transparent"
placeholderTextColor="rgba(0,0,0,0.5)"
autoCapitalize="none"
// onChangeText={(text) => this.setState({userSearch: text })}
value={this.state.text}
onChange={evt => this.onSearchTerm.bind(this)}
onSubmitEditing={this.searchMessages.bind(this)}
/>
</TextInput>
</View>
)
}
}
onSearchTerm(evt) {
this.setState(
Object.assign({}, this.state, { userSearch: evt.nativeEvent.text })
);
evt.preventDefault();
console.log(evt);
}
搜索文本输入在FlatList
中呈现为ListHeaderComponent
:
<List style={{ flex: 1 }}>
<FlatList
..
data={messages}
..
ListHeaderComponent={this.renderSearchInput.bind(this)}
keyboardShouldPersistTaps="always"
/>
</List>
如何在从输入接收文本并将其存储在this.state.userSearch
中时阻止键盘折叠(消失)?