<Modal visible>
<TextInput
onChange={(text)=>{this.setState({value:text})}}
value={this.state.value}
/>
</Modal>
在Modal中使用完全受控状态[1]的TextInput会出现无法输入中文(非英文)的bug(仅iOS)
解决
- TextInput必须为半受控状态
onOk=()=>{
// submit params
this.state.value
}
<Modal visible onOk={this.onOK}>
<TextInput
onChange={(text)=>{this.setState({value:text})}}
- value={this.state.value}
+ defaultValue={this.state.value}
/>
</Modal>
-
不要让外部持续影响Modal内部更新
2.1.
Modal
+TextInput
常作为弹窗表单提交组合,外部最多影响第一次的渲染,因此使用defaultValue
承载首次默认值
2.2. 应避免使用ref
获取TextInput
的值,保留onChange
+state
作为提交时获取的数据
网友评论