React NativeはonPressが動作するためにはダブルクリックする必要があります

Reative Nativeをネイティブベースライブラリと併用しています。キーボードが開いているときに、ネイティブベースのListItem（TouchableOpacityと同等）を起動するには、onPressイベントが必要です。React NativeはonPressが動作するためにはダブルクリックする必要があります

キーボードを閉じるには一度クリックしてから、ListItemを押すことができます。以下

コンテンツが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>

出典

2017-03-15 Molly Harper

私は実際にこれを理解しました。 keyboardShouldPersistTapsを追加

<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>

出典

2017-03-15 16:29:24

-1

私は今、一週間のために、この同じものに引っかかってきました。

私はContentBoxのListItemsを介してフィルタリングしているSearchBoxを持っています。キーボードがなくても、onPressアクションを開始するには2回クリックする必要があります。

<Header searchBar rounded style={{ paddingTop: 0, height: 45 }}> 
      <Item> 
       <Icon name="search" /> 
       <Input 
        placeholder="Search" 
        ref={input => this.searchbox = input} 
        value={term} 
        onChangeText={term => this.setState({term})} /> 
       <Icon active name="close-circle" onPress={() => { 
        this.setState({ term: '' }); 
        this.searchbox._root.focus(); 
       }} /> 
      </Item> 
     </Header> 
     <Content> 
      <List dataArray={ 
      products.filter(product => 
       product.description 
       .toLowerCase() 
       .indexOf(this.state.term.toLowerCase()) >= 0 
      ) 
      } renderRow={product => 
      <ListItem onPress={() => Actions.productdetail({ product })}> 
       <Body> 
       <Text>{product.description}</Text> 
       <Text note>{product.size}</Text> 
       </Body> 
       <Right> 
       <Text note>{product.item_number}</Text> 
       </Right> 
      </ListItem> 
      } /> 
     </Content>

出典

2017-03-15 14:36:37

てみてください=「常に」あなたの内容とリストタグに小道具：私はいつも "コンテンツのタグに加えて、私のリストに小道具= keyboardShouldPersistTapsを追加しました。 –

これは質問に対する答えではありません。 –

React NativeはonPressが動作するためにはダブルクリックする必要があります

答えて

関連する問題