React Native 必须双击 onPress 才能工作 [英] React Native have to double click for onPress to work

问题描述

我将 React Native 与 Native Base 库一起使用.当键盘打开时，我需要一个 onPress 事件来触发 Native Base 的 ListItem(相当于 TouchableOpacity).

I'm using React Native with the Native Base library. I need an onPress event to fire on Native Base' ListItem (equivalent to TouchableOpacity) when the keyboard is open.

我现在必须单击一次以关闭键盘，然后才能按下 ListItem.

I now have to click once to close the keyboard and then I can press the ListItem.

下面的内容标签相当于 ScrollableView:

Content tag below is equivalent to ScrollableView:

<Content keyboardShouldPersistTaps='always' keyboardDismissMode='on-drag'>
  <List>
    <ListItem style={styles.inspectionsItemDivider} itemDivider>
      <TextInput
        autoFocus={true}
        ref={(input) => { this.titleSearch = input }}
        placeholder='Start typing...'
        multiline={true}
        onChangeText={this.setSearchText.bind(this)}
        value={this.getSearchValue()}/>
    </ListItem>
    <View style={styles.searchContainer}>
      <Text style={styles.recentText}>Recommended Descriptions</Text>
      <List dataArray={this.state.searchedDescriptions} 
        renderRow={(description) =>
        <ListItem button onPress={() => this.setInformationDescription(description)}>
          <Text>{description}</Text>
        </ListItem>
      </List>
    </View>
  </List>
</Content>

推荐答案

其实我刚刚想通了.除了 Content 标签之外，我还添加了 keyboardShouldPersistTaps='always' 道具到我的列表中:

I actually just figured this out. I added the keyboardShouldPersistTaps='always' prop to my List, in addition to the Content tag:

<Content keyboardShouldPersistTaps='always' keyboardDismissMode='on-drag'>
  <List>
    <ListItem style={styles.inspectionsItemDivider} itemDivider>
      <TextInput
        autoFocus={true}
        ref={(input) => { this.titleSearch = input }}
        placeholder='Start typing...'
        multiline={true}
        onChangeText={this.setSearchText.bind(this)}
        value={this.getSearchValue()}/>
    </ListItem>
    <View style={styles.searchContainer}>
      <Text style={styles.recentText}>Recommended Descriptions</Text>
      <List keyboardShouldPersistTaps='always' dataArray={this.state.searchedDescriptions} 
        renderRow={(description) =>
        <ListItem button onPress={() => this.setInformationDescription(description)}>
          <Text>{description}</Text>
        </ListItem>
      </List>
    </View>
  </List>
</Content>

这篇关于React Native 必须双击 onPress 才能工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！