redux 오류

[조윤빈]

react로 키오스크 만들기를 하고있는데 redux 강의 듣고 적용하다가 이런 오류가 떠서 질문드립니다....
state의 불변성을 유지하는 것에 대한 오류 같은데 아무리 해도 어떤 부분이 틀린건지 모르겠습니다 ㅠㅠ

Main.js

import React, { useState, useRef ,useEffect} from 'react';
import {Routes,Route,Link} from 'react-router-dom';
import {useSelector,useDispatch} from "react-redux";
import {changePrice} from "./store.js";
import Menu from './Menu';
import MenuList from './MenuList';
import './App2.css';

function Main(){

    let store = useSelector((state) => state)
    let dispatch = useDispatch();

   const [checkedMenus,setCheckedMenus] = useState([
    
   ]); // 선택된 메뉴들이 저장되는 배열

   const nextId = useRef(1); // 선택된 메뉴들의 id는 1부터 시작

   const onCreate = (menuImage, menuName, menuPrice) => {
    const checkedmenu = {
        id:nextId.current,
        menuImage,
        menuName,
        menuPrice
   }
   setCheckedMenus([...checkedMenus,checkedmenu])
   nextId.current += 1;
   store.orderAmount += 1;

   dispatch(changePrice(menuPrice));
   }
/*  이하생략 */

store.js

import { configureStore, createSlice } from '@reduxjs/toolkit'

let orderAmount = createSlice({
    name:'orderAmount',
    initialState:0
})
let orderPrice = createSlice({
    name:'orderPrice',
    initialState:0,
    reducers: {
        changePrice(state,action){
            return state + action.payload;
        }
    }
})

export let {changePrice} = orderPrice.actions;

export default configureStore({
  reducer: { 
      orderAmount : orderAmount.reducer,
      orderPrice: orderPrice.reducer
  }
})  

[codingapple]

store에있는 orderAmout 직접 변경하지말고 reducer 하나 만들어서 변경합시다

[글쓴이]

글