Параметры не отображаются в раскрывающемся списке «реакция выбора», но можно увидеть, что массив хорошо выглядит в console.log - PullRequest
Новая
       9

Параметры не отображаются в раскрывающемся списке «реакция выбора», но можно увидеть, что массив хорошо выглядит в console.log

0 голосов
/ 11 июля 2019

У меня есть асинхронный вызов API (с использованием Axios), чтобы получить все мои «опции» с сервера.Я вижу, что ответ приходит даже в измененном API, чтобы возвращать опции с «меткой» и «значением» в массиве.

Я пытался использовать компонент, который также не работал.Я даже не пытаюсь установить значение, просто хочу отобразить список опций.Удалили компонент до минимума

Вот мой полный компонент: 

import Api from "../API/Api";

import Select from "react-select/async";

// so I have access to the AccessToken for any requests I need to send..
// Might want to 'catch' a 401 error and retry the submission, but lets first
// see if the form works properly
import { useCookies } from "react-cookie";

const GetSuppliers = () => {
  const [cookies] = useCookies("accessToken");
  const [input, setInput] = useState("");
  const [suppliers, setSuppliers] = useState([]);

  const askApi = async searchInput => {
    await Api.get("supplier", {
      headers: {
        Authorization: "Bearer ".concat(cookies.accessToken)
      },
      params: {
        searchString: ""
      }
    }).then(response => {
      setSuppliers(response.data);
      return response.data;
    });
  };

  useEffect(() => {
    askApi();
  }, []);

  if (suppliers.length == 0) {
    return <div>Loading ... </div>;
  } else {
    console.log(suppliers);
    return (
      <div className="DropdownField">
        <Select cacheOptions options={suppliers} defaultOptions />
      </div>
    );
  }
};
export default GetSuppliers;

console.log (поставщики);возвращает: 

1: {value: 5609, label: "AAE02-01-AP", name: "Supplier name 2"}
2: {value: 6197, label: "AAG01-01-AP", name: "Supplier name 3"}
3: {value: 6402, label: "AAL01-01-AP", name: "Supplier name 4"}
4: {value: 6486, label: "AAN01-02-AP", name: "Supplier name 5"}

Так что я ожидаю, что это сработает.Где я скучаю по сюжету?

1 Ответ

0 голосов
/ 11 июля 2019

Это была ошибка новичка (по крайней мере, я новичок, поэтому никто не может обвинить меня).

Во время исходной борьбы я попытался выбрать асинхронный режим, поэтому при импорте все еще использовался выбор «Асинхронный».

Изменено import Select from "react-select/async"; чтобы: import Select from "react-select";

И вуаля, варианты показаны!

...