Pass the state of the autocomplete field to API

[pixsolution]

Hello, I need to consume an api and pass the state of the autocomplete field, that is, this is my api https://www.mydomain.com/api/searchuserL?email= after the = it should receive the letters that I write in the autocomplete field eg. https://www.mydomain.com/api/searchuserL?email=searchterm Is it possible to do it with this library? I try using the onChangeText = {(text) => this.setState ({text})} to save the value and pass it to the api but when I use it it simply does not allow writing in autocomplete field?

Is there any way I can make this requirement?

Regards

[PaitoAnderson]

Totally possible, just use the fetchData prop.

Example code:

fetchData={async (searchTerm) => {
    return await search(searchTerm);
}}

[pixsolution]

Hi @PaitoAnderson thanks for your reply

I tried that as you indicated but it keeps searching/loading the field and does nothing. Below attached code

fetchDataautocompletado = async (searchTerm) => {
  const response = await fetch(
 https://www.mydomain.com/api/searchuserL?emaill=${searchTerm}
);
  const autoc = await response.json();
  this.setState({ autocompletado: autoc });
  //};
  (componentDidMount() {
  this.fetchDataautocompletado();

  // In the autocomplete I added this field: 

   <Autocomplete
         defaultValue={searchTerm}

[PaitoAnderson]

So it would be more like this:

<Autocomplete
    fetchData={async (searchTerm) => {
        const response = await fetch(`https://www.mydomain.com/api/searchuserL?emaill=${searchTerm}`);
        return await response.json();
    }}
/>

[pixsolution]

Thank you! Now changing it as you say gives me the following error:

It is because the way you say it would remove state //data={this.state.autocompletado} then the code:

<Autocomplete
                  key={shortid.generate()}
                  style={baseStyles.input}
                  scrollToInput={ev => { }}
                  handleSelectItem={(item, id) => this.handleSelectItem(item, id)}
                  onDropdownClose={() => { }}
                  onDropdownShow={() => { }}
                  //data={this.state.autocompletado}
                  minimumCharactersCount={1}
                  defaultValue={searchTerm}
                  //onChangeText={(text) => this.setState({ text })}
                  highlightText
                  valueExtractor={item => item.email}
                  rightContent
                    rightTextExtractor={item => item.properties}
                    fetchData={async (searchTerm) => {
                     const response = await fetch(`https://www.mydomain.com/api/searchuserL?email=${searchTerm}`);
                    return await response.json();
                    }}
                  />

How do I send in this way what the user writes because the searchTerm is no longer defined?

[PaitoAnderson]

If the error is on load I would just delete this line defaultValue={searchTerm}.

[pixsolution]

Thanks a lot it work :)

Last question, how can I change the placeholder?

[PaitoAnderson]

placeholder="Whatever"