Why an array is undefined in state React Redux toolkit

Viewed 978

when trying to console.log a piece of (an array) managed with @reduxjs/toolkit it is always either undefined or proxy.

when using import { original } from "immer"; and console.log(original(state.theArrayImTryingToLog)); I simply get: undefined.

when using console.log(state.theArrayImTryingToLog); I get: 0: Proxy [[Handler]]: null [[Target]]: null [[IsRevoked]]: true length: 1 This is logged when the array initially defined as an empty array or even when I set a dummy object in it.

I read in other posts that this might be an Immer issue, but since I always get undefined / proxy I suspect it might be something else.

Also when console.log(JSON.stringify(state.theArrayImTryingToLog)); I get the correct array with all of its elements.

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
    },
  },
});
0 Answers
Related