Вызов API с использованием React Hooks

Question

Я пытаюсь получить API с реакционными крючками. Я могу получить данные из API и объявил некоторые атрибуты с помощью useState. Теперь я пытаюсь установить атрибуты из API в атрибуты в useState, так же, как вы сделали бы это с setState в компонентах класса, но я не уверен, как это сделать go.

Выше приведены данные пользователя, для которых я сделал console.log в обещании.

Answer 1

useState возвращает array, где первый элемент - это данные, а второй - функция, которую вы вызываете где угодно для обновления состояния позже.

Из вашего примера:

    // Receive the array from useState and use the "array destructuring"
    const [myState, setMyState] = useState({/*... you data */});

    // ...
    useEffect(() => {
        // fetch...
        // .then...
        .then(userData => {
            console.log(userData);
            setMyState(userData); // call the function here
        });
    // ...

Этого должно быть достаточно для обновления вашего объекта состояния!

Answer 2

Вам нужно внести несколько изменений, во-первых, начальное состояние должно быть массивом

const [initialState, setInitialState] = useState([])

Я бы использовал массив, так как ответ дает вам массив пользователей, в вашем выражении then где у вас есть console.log, который вы можете сделать

setInitialState(userData)

Это обновит значение initialState массивом элементов, если вы действительно планируете использовать только одного пользователя, просто выберите один из массива userData. SetInitialState будет функцией, которую вы должны использовать, когда планируете использовать значение initialState.