问题描述:
在TextInput中输入文本 ,会弹出软键盘 ,当我收回软键盘时框焦点还在这个输入框中。
分析:
需要监听键盘的收起事件,然后控制输入框,使输入框失去焦点
代码:
export default class InputItem extends Component {
constructor(props) {
super(props);
this.inputRef = React.createRef();
}
componentDidMount() {
this.keyboardDidHideListener = Keyboard.addListener(
'keyboardDidHide',
this._keyboardDidHide,
);
}
componentWillUnmount() {//当组件移除时,取消监听
this.keyboardDidHideListener.remove();
}
_keyboardDidHide = () => {//键盘收起
this.inputRef.current.blur();//使输入框失去焦点
};
render() {
return (
<TextInput
ref={this.inputRef}
onSubmitEditing={Keyboard.dismiss}//当结束编辑后,点击键盘的提交按钮时触发事件
value={this.state.value}
/>
);
}
}