在iOS中反应原生AutoComplete下拉菜单无法滚动

时间:2019-10-29 10:40:02

标签: css react-native scroll dropdown react-native-ios

我想在react-native中使用autoComplete输入,我发现的最佳选择是   react-native-autocomplete-input ,我的问题是我无法在IOS中滚动下拉列表,但在android中却可以。

我尝试了此解决方案,但无济于事:( https://github.com/mrlaessig/react-native-autocomplete-input/issues/57#issuecomment-332723713

我检查了很多建议,但没有任何帮助,如果使用它的人会帮忙,我会很高兴!

return (
      <View style={styles.container}>
        {showAddChar && (
          <Text style={styles.addChar} onPress={this.onChoosenItem}>
            +
          </Text>
        )}
        <Autocomplete
          data={data}
          defaultValue={query}
          onChangeText={(text: string) =>
            this.setState({ query: text, hideResult: false })
          }
          keyExtractor={index => index['id'].toString()}
          inputContainerStyle={styles.inputContainerStyle}
          listContainerStyle={{}}
          listStyle={styles.listStyle}
          style={{ fontSize: 18 }}
          hideResults={hideResult}
          placeholder={placeholder}
          renderItem={({ item }) => (
            <TouchableOpacity
              style={styles.item}
              onPress={() => this.onChoosenItem(item)}
            >
              <Text>{item['name']}</Text>
            </TouchableOpacity>
          )}
        />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    left: 0,
    position: 'absolute',
    right: 0,
    top: 0
  },
  addChar: {
    zIndex: 1,
    position: 'absolute',
    fontSize: 30,
    right: 0,
    top: 0
  },
  inputContainerStyle: {
    borderColor: 'rgb(70, 48, 235)',
    borderBottomWidth: 3,
    borderTopWidth: 0,
    borderRightWidth: 0,
    borderLeftWidth: 0
  },
  //   listContainerStyle: {height:filteredMembers.length * 70},
  listStyle: {
    borderColor: 'grey',
    margin: 0,
    overflow: 'scroll',
    maxHeight: 200
  },
  item: {
    fontSize: 16,
    borderBottomColor: 'grey',
    borderBottomWidth: 2,
    padding: 12
  }
});

enter image description here

0 个答案:

没有答案