代码之家  ›  专栏  ›  技术社区  ›  Shivam

反应onPress工作所需的两个本机抽头

  •  4
  • Shivam  · 技术社区  · 6 年前

    我创建了一个autoconplete搜索字段,它使用mapbox API显示位置。我正在使用ListView for Sugestions列表。当列表出现时,我点击需要选择的地址,第一次点击时键盘隐藏,第二次点击时onPress工作。

    enter image description here

    我在想到底出了什么问题。

     <View style={styles.container}>
                              <View style={styles.searchContainer}>
                                <View style={styles.mapMarkerContainer}>
                                  {mapMarkerIcon}
                                </View>
                                <View style={styles.inputContainer}>
                                  <TextInput
                                      style={styles.textinput}
                                      onChangeText={this.searchLocation}
                                      placeholder="Type your address here" 
                                      underlineColorAndroid='rgba(0,0,0,0)'
                                      value={this.state.inputVal}
                                      placeholderTextColor="#fff"
                                  />
                                </View>
                              </View>
                              <View keyboardShouldPersistTaps='always' style={styles.listViewContainer}>
                                <ListView
                                    dataSource={ds.cloneWithRows(this.state.searchedAdresses)}
                                    renderRow={this.renderAdress} 
                                    style={styles.listView}
                                    renderSeparator={this.renderSeparator}
                                    enableEmptySections
                                />
                              </View>
    </View>
    

    渲染连衣裙

    renderAdress = (address) => {
            return (
                <TouchableOpacity onPress={() => this.onListItemClicked(address)} style={styles.listItem}>
                    <View>
                        <Text>{address.place_name}</Text>
                    </View>
                </TouchableOpacity>
            );
    };
    

    onListItemClicked

    onListItemClicked= (address) => {
          this.props.onAddressGet(address);
          console.log(address);
          this.setState({
            searchedAdresses: [],
            inputVal: address.place_name
          });
    }
    
    1 回复  |  直到 6 年前
        1
  •  4
  •   itinance    6 年前

    您应该将keyboardShouldPersistTaps属性移动到ListView,因为它是ScrollView中的一个属性,将继承到ListView:

    而不是

    <View keyboardShouldPersistTaps='always' 
        <ScrollView ...>
    

    您需要:

    <View 
        <ScrollView keyboardShouldPersistTaps='always'  ...>
    

    https://facebook.github.io/react-native/docs/scrollview.html#keyboardshouldpersisttaps