장바구니 삭제 이게 맞는지 모르겠습니다.

[남도일]

store.js

import {configureStore, createSlice} from '@reduxjs/toolkit'
import user from './store/userSlice'

let cart = createSlice({
name:'cart',
initialState:[
 {id : 0, name : 'White and Black', count : 2},
 {id : 2, name : 'Grey Yordan', count : 1},
 ],
 
reducers:{
changeCount(state,action){
let number = state.findIndex((a)=>{return a.id === action.payload})
state[number].count++
 },
addItem(state,action){
state.push(action.payload)
 },
deleteItem(state,action){
state.filter((x) => x.id !== action.payload);
 
return deleteItem();
 
 }
 }
})

export let { addItem,changeCount,deleteItem } = cart.actions

export default configureStore({
reducer: {
user : user.reducer,
cart : cart.reducer
}
})

cart.js

import { Table } from "react-bootstrap";
import { useDispatch, useSelector } from "react-redux";
import { changeName, changeAge } from "../store/userSlice";
import {changeCount,deleteItem} from "../store"
function Cart() {
let state = useSelector((state) => state);
let dispatch = useDispatch();
return (
<div>
{state.user.name}
{state.user.age}의 장바구니
<button
onClick={() => {
dispatch(changeAge(100));
 }}
>
 버튼
</button>
<Table>
<thead>
<tr>
<th>#</th>
<th>상품명</th>
<th>수량</th>
<th>변경하기</th>
</tr>
</thead>
<tbody>
{state.cart.map((a, i) => (
<tr key={i}>
<td>{state.cart[i].id}</td>
<td>{state.cart[i].name}</td>
<td>{state.cart[i].count}</td>
<td>
<button
onClick={() => {
dispatch(changeCount(state.cart[i].id));
 }}
>
 +
</button>
<button onClick={()=>{
dispatch(deleteItem(state.cart[i].id))
 }}>삭제</button>
</td>
</tr>
 ))}
</tbody>
</Table>
</div>
 );
}

export default Cart;

//redux state변경하려면
// 1. state변경해주는 함수 만들기
// 2. export
// 3. dispatch(state변경함수()

[codingapple]

deleteItem함수안에서 
var 어쩌구 = state.filter(~~);
return 어쩌구;
이렇게 쓰는게 나을듯요

[글쓴이]

글