在 redux 状态下获取未定义的对象

Question

我正在调用 api 一个 returns 一堆对象，然后调度响应。

当我查看 redux devtool 时，对象被正确调度，但在状态下它存储为 "undefined[object Object],[object Object],[object Object],........,"。

API格式：

0: {id: 188, category_id: 23, en_name: "The Local", en_description: "Lorem Ipsum", price: 12, …}
1: {id: 212, category_id: 25, en_name: "Protein", en_description: "Lorem Ipsum", price: 5, …}
2: {id: 205, category_id: 24, en_name: "House Buttermilk Biscuits and Gravy", en_description: "Lorem Ipsum", price: 10, …}
3: {id: 206, category_id: 24, en_name: "Griddle me this Pancakes", en_description: "Lorem Ipsum", price: 10, …}

Redux devtool 显示的 dispatch 也和上面一样 api.

在使用 redux devtool 检查状态时，

"undefined[object Object],[object Object],[object Object],........,"

代码：

  useEffect(() => {
    async function fetchData() {
      const response = await axios.get(
        "https://theapi.com/something/something"
      );
      let { categories, menus } = response.data;

      setCategories(categories);
      dispatch(setItemToCart(menus));
    }
    fetchData();
  }, []);

减速器和动作：

const initialState = {
  items: [],
};

export const addItems = createSlice({
  name: "cart",
  initialState,
  reducers: {
    setItemToCart(state, action) {
      state.items = state.item + action.payload;
    },
  },
});

export const { setItemToCart } = addItems.actions;

Answer 1

reducer 应该实现为

state.items = [...state.items, action.payload];

在 redux 状态下获取未定义的对象

Getting undefined object in redux state

redux

react-redux

redux-toolkit