2017-03-15 104 views
7

我在本地基礎庫中使用了React Native。當鍵盤打開時,我需要一個onPress事件觸發Native Base的ListItem(相當於TouchableOpacity)。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> 

回答

16

我其實只是想通了。我加入了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> 
-1

我一直停留在這同樣的事情現在一個星期。

我有一個SearchBox,我在內容標記中通過ListItems過濾。即使沒有鍵盤,我也必須點擊兩次來啓動onPress動作。

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

嘗試添加keyboardShouldPersistTaps =「總是」託你的內容,並列出代碼。 –

+0

這不是問題的答案。 –

相關問題