javascript - 为什么调度操作会重写我的商店价值？

Question

我使用 redux 钩子从我的功能组件分派了两次到 redux 商店。

当我像这样单独调度这些时，只有其中一个存储在我的 redux 存储中，因为它似乎每次都会刷新并且只保留一个。我怎样才能将它们一起调度或防止 redux 存储刷新和丢失第一个调度有效负载？

dispatch({
              type: "access_token",
              payload: googleUser.accessToken,
            });
            dispatch({
              type: "firebase_userId",
              payload: result.user.uid,
            });

Redux 商店

import React from "react";
import symbolicateStackTrace from "react-native/Libraries/Core/Devtools/symbolicateStackTrace";
import { applyMiddleware, createStore } from "redux";
import thunk from "redux-thunk";

const initialState = {
  access_token: "",
  firebase_userId: "",
};

const counterReducer = (
  state = initialState,
  action
) => {
 
 

  if (action.type === "access_token") {
 
    return {
      
      access_token: action.payload,
    };
  }

  if (action.type === "firebase_userId") {
  
    return {
     
      firebase_userId: action.payload,
    };
  }

  return state;
};

const store = createStore(counterReducer, applyMiddleware(thunk));

export default store;

Answer 1

在你的 reducer 中，你总是需要返回当前状态的副本。那就是问题所在。你如何调度动作没有错。

const counterReducer = (
  state = initialState,
  action
) => {

  if (action.type === "access_token") {
 
    return {
      // copy & update state
      ...state,
      access_token: action.payload,
    };
  }

  if (action.type === "firebase_userId") {
  
    return {
     // copy & update state
     ...state,
      firebase_userId: action.payload,
    };
  }

  return state;
};