Блог

У меня есть два крючка:

 const dispatch = useDispatch();
const response = useSelector(state => state.responseData);
  

И submit функция:

         const submit = () => {
        
            dispatch(connectToServer(`${BASE_URL}user/signIn`, {
              email: state.email,
              password: state.password
            }, 'post'))
        
            if (response.data.token) <--- this data is 1 step late
              //do smth
  

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

Здесь есть три проблемы:

• connectToServer Действие, по-видимому, выполняет некоторую асинхронную работу, поэтому ответ не может быть обновлен к моменту выполнения следующей строки
• Даже если вы это сделаете await dispatch(connectToServer()) , React, возможно, еще не отрисовал повторно
• Обратный вызов может ссылаться только на значения переменных, которые существовали в области видимости на момент определения обратного вызова, то есть на визуализацию до того, как пользователь нажал кнопку «Отправить».

Вам нужно либо:

• Переместите обработку ответа в сам блок
• Попросите thunk извлечь обновленные данные из хранилища и вернуть их / использовать каким-либо образом
• Переместите обработку токена ответа в useEffect и дождитесь следующего повторного рендеринга с правильными данными