首页 > 解决方案 > 为什么在状态 React Redux 工具包中未定义数组

问题描述

当尝试 console.log 使用 @reduxjs/toolkit 管理的一块(数组)时,它总是未定义或代理。

使用时import { original } from "immer";console.log(original(state.theArrayImTryingToLog)); 我只是得到:未定义。

使用时console.log(state.theArrayImTryingToLog); 我得到: 0: Proxy [[Handler]]: null [[Target]]: null [[IsRevoked]]: true length: 1 当数组最初定义为空数组时,甚至当我设置一个里面的虚拟对象。

我在其他帖子中读到这可能是一个 Immer 问题,但由于我总是得到未定义/代理,我怀疑它可能是其他问题。

此外,当console.log(JSON.stringify(state.theArrayImTryingToLog));我得到包含所有元素的正确数组时。

import { createSlice } from "@reduxjs/toolkit";
import { getProducts } from "../api/product.api";
import { original } from "immer";

const productsSlice = createSlice({
  name: "products",
  initialState: {
    products_in_cart: [],

  },
  reducers: {
       add_to_cart: (state, action) => {
      console.log(state.products_in_cart); -> proxy as above
      console.log(original(state.products_in_cart)); -> undefined
      console.log(JSON.stringify(state.products_in_cart)); -> correct array as string
    },
  },
});

标签: reactjsreact-reduxredux-toolkitimmer.js

解决方案


推荐阅读