react-native中使用ant-mobile的InputItem时如何点击其他地方收起键盘?

使用ant的InputItem时,发现点击屏幕上其他地方并不会让input失去焦点,所有需要手动收起键盘,解决方案是:

import { InputItem } from 'antd-mobile';
const dismissKeyboard = require('dismissKeyboard');//react-native自带
...
 <TouchableWithoutFeedback onPress={()=>{ dismissKeyboard()}}>
     <View style={styles.container}>//最外层View
         ...
        <InputItem
          ref={node=>this.input=node}
          placeholder="请输入储蓄卡号"
          clear
          style={{ borderBottomWidth: 0 }}
          >
        </InputItem>
        ...
     </View>
 </TouchableWithoutFeedback>
...

注:需要在整个View组件外部套上一个TouchableWithoutFeedback来模拟失去焦点事件。

只要这样就可以达到预期效果了。

猜你喜欢

转载自blog.csdn.net/xjl271314/article/details/80196129