我对 React Native 相当陌生,并且在使用 onChangeText 时遇到问题。
我正在尝试使用 TextInput 来输入单词并更新状态。当我使用 onChangeText 时,我一次只能输入 1 个符号,直到它重新呈现。我可以通过使用来保持值(value)
value = {this.state.text}
但每次写信时输入字段仍然失去焦点。
我也尝试过使用 onBlur 和 onSubmitEditing 但没有成功。
这是我当前的代码。这是在 render() 内部。
<View style={{padding: 10}}>
<TextInput
onChangeText={(text) => { this.setState({text: text})} }
/>
<TouchableHighlight style={styles.button} onPress={this.handlePress.bind(this)}>
<Text style={styles.buttonText}>Login</Text>
</TouchableHighlight>
<Text style={{padding: 10, fontSize: 42}}>
{this.state.text}
</Text>
</View>
因此,通过使用这种方法,我目前一次只能写一个字母,因为 this.state.text 一次只能包含一个字母。
感谢任何帮助。
已解决
我使用了react-native-tab-view,它使用它自己的路由器。 我将代码写为 this 正如您所看到的,渲染部分发生在 return() 之外。这就是导致我的问题的原因。 我已经删除了react-native-tab-view并将其重写为this
最佳答案
<TextInput style={styles.input}
placeholder='username'
onChangeText={(text) => { this.setState({ username: text})}}>
</TextInput>
您需要{
}
打开和关闭功能 block ,否则返回 setState
() => callFn
相当于 () => {return callFn}
所以你返回你的 setState 调用。
您需要这里() => {callFn}
并删除 {this.state.text}
来自您的<Text>
标签,每次更改 state
时都会触发重新渲染
关于reactjs - 在 React Native 中正确使用 onChangeText,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53009358/