首页 > 解决方案 > 反应减速器,状态不立即更新

问题描述

我正在使用减速器createContextreducers我正在更新状态值,但它不是一次更新值,我这样做console.log(user);onSubmitSave(),但是在控制台日志中我一次没有得到它的更新状态,我可以看到它在我工作时工作再次点击登录,在这里我附上了我的整个代码,任何人都可以查看它,并帮助我解决这个问题吗?

auth.js

import { createContext } from 'react';

    const AuthContext = createContext({
      user: null,
      hasLoginError: false,
      login: () => null,
      logout: () => null
    });
    
    export default AuthContext;

登录.js

// Login button Click
  async function onSubmitSave(e) {
    e.preventDefault();

    const messages = {
      'itemUsername.required': 'Username cannot be empty.',
      'itemPassword.required': 'Password cannot be empty.',
    };
    const rules = {
      itemUsername: 'required',
      itemPassword: 'required|string',

    };
    validateAll(state, rules, messages)
      .then(async () => {
        let data = await login(itemUsername, itemPassword);
        console.log(data);
        console.log("sdsds");
        console.log(user);
        setUserData(user);
      })
      .catch(errors => {
        const formattedErrors = {

        };

        errors.forEach(error => formattedErrors[error.field] = error.message);

        setState({
          ...state,
          errors: formattedErrors
        });
      })

  }
  // End Login 

应用程序.js

const reducer = (state, action) => {

  switch (action.type) {
    case "login": {
      const { username, password } = action.payload;

      return {
        ...state,
        hasLoginError: false,
        user: {
          id: 1,
          username: USERNAME,
          firstName: "Dev",
          lastName: "To"
        }
      };


    }
    case "logout":
      return {
        ...state,
        user: null
      };
    default:
      throw new Error(`Invalid action type: ${action.type}`);
  }
};

标签: reactjsredux-reducers

解决方案


推荐阅读