反应本机 onStartShouldSetResponder 参数不适用于 AutoCompeletInput 插件答案

【问题标题】：React native onStartShouldSetResponder parameter not working for AutoCompeletInput plugin反应本机 onStartShouldSetResponder 参数不适用于 AutoCompeletInput 插件
【发布时间】：2018-09-10 08:55:57
【问题描述】：

我正在使用自动完成输入插件。 我已将此组件放置在 Scrollview 中。 它的其他行为很好，例如使用我们的自定义设计在弹出窗口中显示建议列表。

推荐插件：- Plugin

但 onStartShouldSetResponder{()=>true} 不起作用。因此，我无法滚动我的建议列表。

这是我实现的代码 =>

<ScrollView keyboardShouldPersistTaps='always' style={[commonstyles.mainContainer,styles.mainContainer,{marginBottom:20}]}>
            <View style={{width:width-30,height:45}}>
            <Autocomplete
              autoCapitalize="none"
              autoCorrect={false}
              hideResults={false}
              containerStyle={{flex: 1,left: 10,position: 'absolute',right: 10,top: 0,zIndex: 1}}
              data={films.length === 1 && comp(query, films[0].name) ? [] : films}
              defaultValue={query}
              onChangeText={text => this.setState({ query: text })}
              placeholder="Select Contact"
              renderItem={({ id,name }) => (
                <TouchableOpacity onStartShouldSetResponder={()=>{return true;}} activeOpacity={1} onPress={() => this.setState({ query: name })}>
                  <Text style={{fontSize:Global.DESCRIPTION_FONT_SIZE,color:Global.APP_BLACK_COLOR,borderBottomWidth:0.5,borderColor:Global.APP_BLACK_COLOR,padding:5}}>
                    {id} {name}
                  </Text>
                </TouchableOpacity>
              )}
            />
            </View>

</Scrollview>

如果我做错了什么，请告诉我。
我也无法理解 onStartShouldSetResponder() 函数的实现。
建议在 react native 中使用类似于 Android AutoCompleteTexview 组件的自动完成输入示例。

【问题讨论】：

标签： android react-native react-native-scrollview

【解决方案1】：

将 scrollEnabled 参数添加到您的 Scrollview。

试试下面的代码

<ScrollView scrollEnabled={this.state.enableScrollViewScroll} keyboardShouldPersistTaps='always' style={[commonstyles.mainContainer,styles.mainContainer,{marginBottom:20}]}>
    <View style={{width:width-30,height:45}}>
    <Autocomplete
      autoCapitalize="none"
      autoCorrect={false}
      hideResults={false}
      onStartShouldSetResponderCapture={() => {
         var self=this;
         this.setState({ enableScrollViewScroll: false });
         console.log("Here==>",self.state.enableScrollViewScroll);
      }}
      containerStyle={{flex: 1,left: 10,position: 'absolute',right: 10,top: 0,zIndex: 1}}
      data={films.length === 1 && comp(query, films[0].name) ? [] : films}
      defaultValue={query}
      onChangeText={text => this.setState({ query: text })}
      placeholder="Select Contact"
      renderItem={({ id,name }) => (
        <TouchableOpacity  activeOpacity={1} onPress={() => this.setState({ query: name,enableScrollViewScroll:true })}>
          <Text style=                {{fontSize:Global.DESCRIPTION_FONT_SIZE,color:Global.APP_BLACK_COLOR,borderBottomWidth:0.5,borderColor:Global.APP_BLACK_COLOR,padding:5}}>
        {id} {name}
          </Text>
        </TouchableOpacity>
      )}
    />
    </View>

</Scrollview>

【讨论】：