当 TextInput 获得焦点时，按两次以使按钮工作答案

【问题标题】：pressing twice to make the button work when TextInput is focused当 TextInput 获得焦点时，按两次以使按钮工作
【发布时间】：2018-06-15 13:09:00
【问题描述】：

我在尝试从TextInput 组件提交数据时遇到问题。当尝试按下调用处理文本的回调的按钮时，需要按下它两次才能工作。一次为TextInput 失去焦点，第二次调用回调。我尝试了this 解决方案，但对我没有用。

组件：

  <Modal>
    <ScrollView>
      <Card>
        <CardImage source={{uri: this.props.linkImage}}/>
        <CardContent/>
      </Card>
      {
        this.state.single.map((comment) => {
          return comment[3] ?  
            <Comp/> : null                                           
          })
      }
  </ScrollView> 
    <KeyboardAvoidingView behavior="padding" enabled>   
      <CardAction>
      <TouchableOpacity>
        <IconFA name="reply"/>
      </TouchableOpacity>
      <TouchableOpacity>
        <IconEn name="thumbs-up"/>
      </TouchableOpacity>
      <TouchableOpacity>
        <IconEn name="thumbs-down"/>
      </TouchableOpacity>

      </CardAction> 
      <CardAction>
        <TextInput ref={input => this.input = input}/>
        <TouchableOpacity>
          <IconFA name="rocket"/>
        </TouchableOpacity> 
      </CardAction> 
    </KeyboardAvoidingView>             
  </Modal>

【问题讨论】：

你为keyboardShouldPersistTaps prop提供了哪个值？
always 虽然我可能错过了它，但我应该将哪个组件包装在 keyboardShouldPersistTaps 中？
<ScrollView keyboardShouldPersistTaps="always">
是的，但你建议用它包装哪个组件？

标签： reactjs react-native

【解决方案1】：

只需将 keyboardShouldPersistTaps="always" 属性传递给 ScrollView，像这样包装您的组件：

<ScrollView keyboardShouldPersistTaps="always">
   ...content
<ScrollView>

【讨论】：