プレースホルダにアイコンを置く - ネイティブに反応する

Question

私はnpm react-native-autocomplete-inputを使用していますが、私の質問は、それに関する文書がないので、アイコンをプレースホルダに入れることができます。

私は既にいくつかのものをコーディングしているので、別のnpmオートコンプリートを使用することはできません。

が

自動補完の構造はこれです：：今のところ

、私はこれを持って

<Autocomplete 
    data={data} 
    defaultValue={query} 
    onChangeText={text => this.setState({ query: text })} 

    placeholder="Here is my placeholder" 

    renderItem={data => (
     <TouchableOpacity onPress={() => this.setState({ query: data })}> 
      <Text>{data}</Text> 
     </TouchableOpacity> 
)} /> 

Answer 1

ライブラリはデフォルトのTextInputを使用するため、プレースホルダを追加する定義された方法はありません画像。ビューを自動完成してレイアウトを作成する場合は、コンビネーションを使用する必要があります。

<View style={styles.searchSection}> 
    <Icon style={styles.searchIcon} name="ios-search" size={20} color="#000"/> 
    <Autocomplete 
    data={data} 
    defaultValue={query} 
    onChangeText={text => this.setState({ query: text })} 

    placeholder="Here is my placeholder" 

    renderItem={data => (
     <TouchableOpacity onPress={() => this.setState({ query: data })}> 
      <Text>{data}</Text> 
     </TouchableOpacity> 
)} /> 
</View>