asyn c custom hooks не предоставляет обновленные данные - PullRequest
1 голос
/ 27 мая 2020

У меня есть простая ловушка, которая помогает мне обрабатывать POST-запрос. В следующем коде я ожидаю, что unsub будет true после завершения POST. Может ли кто-нибудь указать на что-нибудь, что я мог сделать неправильно?

Пользовательский крючок

const useUnsubscribeEmail = () => {
  const [userId, setUserId] = useState(null);
  const [unsub, setUnSub] = useState();
  const UNSUB_URL = '/web-registry-api/v1/reviews/unsubscription';
  useEffect(() => {
    if (userId) {
      // async POST call
      (async () => {
        try {
          await ApiService.post(`${UNSUB_URL}/${userId}`);
          // update unsub value
          setUnSub(true);
        } catch (error) {
          console.error(error)
        }
      })();
    }
  }, [userId]);

  return [unsub, setUserId];
};

export default useUnsubscribeEmail;

Компонент

const ReviewUnsubscription = () => {
  const { userId } = useParams();
  const [unsub, unsubscribeEmail] = useUnsubscribeEmail();
  return (
    <MinimumLayout>
      <div className={styles.content}>
        <h1>Unsubscribe from email reminders to review products you’ve received from Zola?{unsub}</h1>
        {/* unsub here is still undefined */}
        <Button disabled={unsub} onClick={() => { unsubscribeEmail(userId); }} variant="primary" className={styles.button}>Unsubscribe</Button>
      </div>
    </MinimumLayout>
  );
};

1 Ответ

0 голосов
/ 27 мая 2020

unsub по-прежнему будет неопределенным, пока вы не нажмете кнопку, поскольку вы не установили для него состояние по умолчанию в своем хуке. изменить: const [unsub, setUnSub] = useState(); на const [unsub, setUnSub] = useState(false); - это то, что я бы порекомендовал

Я тестировал на своей стороне и отлично работает; Однако я не могу протестировать APIService.post.

...