首页 > 解决方案 > 未处理的运行时错误类型错误:传播不可迭代实例的无效尝试

问题描述

当我尝试添加到购物车时出现此错误。

Unhandled Runtime Error.
TypeError: Invalid attempt to spread non-iterable instance.
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.
import { createSlice, createAsyncThunk } from '@reduxjs/toolkit';
import { baseURL } from '../../api/config/config';
import axios from 'axios';

export const getCartItemsLocalStorage = createAsyncThunk(
    "cartitems/getCartItems",
    async (val, thunkAPI) => {
        let cartItemFromLocalStoarge = await JSON.parse(localStorage.getItem("cart"));
        return cartItemFromLocalStoarge;
    }
)

export const CartSlice = createSlice({
    name: 'cart',
    initialState: {
        products: [],
        cart: [],
    },
    reducers: {
        addToCart: (state, action) => {
            let actionId = action.payload;
            const item = state.products.find((prod) => prod.id === actionId)

            // Check if  item already exist in cart 
            const inCart = state.cart !== null ? state.cart.find((item) => item.id === actionId ? true : false) : null;
            state.cart = inCart
                ? state.cart.map(item =>
                    item.id === actionId
                        ? { ...item, quantity: item.quantity + 1 }
                        : item
                )
                : [...state.cart, {...item, quantity: 1 }]
            
            localStorage.setItem("cart", JSON.stringify(state.cart))

        },

    });
}

export const { addToCart }  = CartSlice.actions;

export default CartSlice.reducer;

标签: javascriptreactjsnext.js

解决方案


你试图传播state.cartnull


推荐阅读