如何在GooglePlacesAutocomplete中像React Native中的文本输入那样设置样式

xzv2uavs  于 2023-01-27  发布在  React
关注(0)|答案(1)|浏览(125)

我正在工作的React,地点,自动完成在React Native我想要一个像文本输入的风格......
这是我想要像First is GooglePlacesAutocomplete and second is TextInput这样结果的图像

const App = () => {

  return (
    <View>
      <GooglePlacesAutocomplete
        placeholder='Search'
        fetchDetails={true}
        onPress={(data, details) => {
          // console.log('data: ', data);
          console.log('details: ', details);
          alert(details.formatted_address)
        }}
        query={{
          key: '',
          language: 'en',
        }}
      />

      <Text>{'\n'}</Text>
      <Text>{'\n'}</Text>
     <Text>{'\n'}</Text>

        <TextInput
          placeholder='Search here....'
          style={{width:350,height:40,borderBottomColor:'black',borderBottomWidth:1,paddingLeft:10,fontSize:20}}
        />

    </View>
  );
};

export default App;
`


How I Can get output like image??
0ve6wy6x

0ve6wy6x1#

您可以使用这样的格式并自定义输入。

<GooglePlacesAutocomplete
   placeholder="Search location....."
   textInputProps={{
    placeholderTextColor: '#2ff',
   }}
   minLength={1}
   fetchDetails={true}
   styles={{
    listView: {},
    textInputContainer: {},
    textInput: {},
   }}
   debounce={300}
  />

您可以根据需要在textInput中添加样式。

相关问题