Значение состояния не обновляется в следующем коде с использованием response и response-redux - PullRequest
Новая
       14

Значение состояния не обновляется в следующем коде с использованием response и response-redux

0 голосов
/ 04 августа 2020

Сначала в профиле устанавливаются значения по умолчанию. Затем данные извлекаются, а затем я пытаюсь установить значение по умолчанию для извлеченных значений 

 const Profile = () => {
   const [profile, setProfile] = useState({
   name3: "Naman Aggarwal",
   username2: "_naman.agg",
   bio2: "There's nothing holding me back, Nsut'23",
   email2: "naman.aggarwal2001@gmail.com",
});


useEffect(() => {
  fetch("http://localhost:5000/show")
    .then((res) => res.json())
    .then((res2) => {
    console.log(res2.foundUser[0]);

    setProfile((prevValue) => {
      // console.log(profile);
      const { name, username, bio, email } = res2.foundUser[0];
      const { name3, username2, bio2, email2 } = profile;
      return {
        ...prevValue,
        [name3]: name,
        [username2]: username,
        [bio2]: bio,
        [email2]: email,
      };
    });

   // console.log(profile);
   });
  }, []);
 }

Это назначение не работает, я думаю.

1 Ответ

0 голосов
/ 04 августа 2020

добро пожаловать в StackOverflow!

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

В вашей функции useEffect вы возвращаете следующий объект: 

return {
    ...prevValue,
    [name3]: name,
    [username2]: username,
    [bio2]: bio,
    [email2]: email,
  };

Теперь, если вы ожидаете, что объект будет { name3: 'x', username2: 'y', bio2: 'z' } Этого не произойдет. Поскольку вы не сохраняете объект как эти значения, вы заключаете каждый ключ в квадратные скобки [], что означает, что вместо буквального применения name3 username2 bio2 вы применяете его значения.

Поэтому вместо { name3: 'x', username2: 'y', bio2: 'z' } вы получите { x: 'x', y: 'y', z: 'z' } (в основном вы получите значение свойства вместо имени ключа).

Я бы попытался изменить функцию возврата, чтобы она выглядела так: 

return {
...prevValue,
name3: name,
username2: username,
bio2: bio,
email2: email,
};

Надеюсь, я правильно понял проблему, если я не сделал этого, оставьте комментарий, чтобы мы могли обсудить дальше.

...