[error]: options.reduce is not a function

• I am getting option.reduce is not a function error while using async with promise .

<------------get 
  getOptions = (input) => {
    console.log("input",input)
    let url=`search_back/`
    let data={term:input}
  return fetch(`http://localhost:8000/backend/search_back/?term=${input}`,{
    method:'GET',
    headers: {
    'Content-Type': 'application/json',
    Accept: 'application/json',
    Authorization: `JWT ${localStorage.getItem('token')}`
    }
  })
    .then((response) => {
      
      return response.json();
    }).then((json) => {
      console.log("response=",json)
      let js=[]
      for(let i=0;i<json.length;i++)
      {
        js.push({
          "label":json[i]["label"],
          "value":json[i]["value"]
        })
      
      }
    
      return { options: js };
    }).catch(function(error) {
        console.log("error",error);
    });
}
                         <Async
                        name="form-field-name"
                        value={this.state.selectedOption}
                        loadOptions={this.getOptions}
                        onChange={(value) => { 
                          console.log("value =",value)
                          this.setState({selectedOption: value}); 

                        }}
                         filterOptions={(options, filter, currentValues) => {
                            // Do no filtering, just return all options
                            console.log("options =",options)
                            return options;
                        }}                       

                          />
       

`

[skmaingi]

This is the most complicated select component I’ve faced. First you need array with specific columns then the data has to be returned in a specific way. 😫

[JohnDDuncanIII]

We fixed this in our codebase by changing

return {
    options: options.map(...some stuff)
}

to

return options.map(...some stuff)

in our loadOptions func