Обновление свойств объекта в React с помощью useState

#reactjs #state #javascript-objects #use-state

#reactjs #состояние #javascript-объекты #состояние использования

Вопрос:

У меня такое состояние:

   const [test, setTest] = useState({
    test1: "test",
    test2: "test",
    test3: "test",
  });

useEffect(() => {
    setTimeout(() => {
      setTest({
        ...test,
        test1: "test1",
      });
    }, 2000);

    setTimeout(() => {
      setTest({
        ...test,
        test2: "test2",
      });
    }, 3000);
  }, []);
 

и я хочу получить что-то вроде:

 {
  test1: "test1"
  test2: "test2"
  test3: "test"
}
 

но я получаю:

 {
  test1: "test"
  test2: "test2"
  test3: "test"
}
 

Возможно ли это?
Что я делаю не так? Спасибо

Мне нужно сохранить эту форму объекта, я работаю с API, и я не хочу иметь 30 разных состояний использования для каждого API. Я просто хочу иметь все данные API для извлечения в одном объекте и использовать его в качестве опоры.

Ответ №1:

Вместо этого используйте обратный вызов, чтобы у вас была самая актуальная ссылка на текущее test состояние in, вместо того, чтобы иметь только ссылку на оригинал (неизмененный) test из начального монтирования:

 setTest(test => ({
    ...test,
    test2: "test2",
}));