Есть ли способ использовать синтаксис JS rest в массиве зависимостей react hook?

#reactjs #rest #dependencies #react-hooks

#reactjs #rest #зависимости #реагирующие хуки

Вопрос:

У меня есть этот useEffect React hook :

 import {useEffect, useState} from 'react';

const [state, setState] = useState();
useEffect(() => {
    api.post(url, state)
        .then(response => {
            setState(
                ...state,
                response: response.data
            )
        })
}, []);
  

которые используют состояние в качестве полезной нагрузки для запроса API и обновляются state с ответом.

Очевидно, что если я добавлю state массив зависимостей hook, у нас будет бесконечный цикл (потому state что обновление после вызова API), но мне нужно вызывать API и обновлять state.response каждый раз, когда изменяется состояние.

Можно ли обновлять при state изменении значений, за исключением state.response ?

Я пытался :

 const {response, ...rest} = state;
  

и поместить rest внутренние зависимости, но это не работает

Спасибо за вашу помощь

Комментарии:

1. У вас есть состояние в state переменной, которую вы отправляете в серверную часть, и серверная часть отвечает тем же состоянием? Похоже, вам нужно разделить это состояние на а) то, что вы хотите показать / изменить в этом компоненте, и б) то, что вы хотите отправить на серверную часть.

Ответ №1:

Вы можете сделать что-то вроде

 import React, {useEffect, useState} from 'react';

const [state, setState] = useState({
    apiParam: {},
    response: null
  });

useEffect(() => {
    api.post(url, state.apiParam)
        .then(response => {
            setState(state=>({
                ...state,
                response: response.data
             })    
            )
        })
}, [state.apiParam]);