initialState: {
products: [
{ id: 0, name: 'White and Black', count: 2 },
{ id: 2, name: 'Grey Yordan', count: 1 },
],
},
removeItem(state, action) {
return state.products.filter((i) => i.id !== action.payload);
},
리덕스는 이렇게되어있고,
Cart.js
{products &&
products.map((item, index) => (
<tbody key={index}>
<tr>
<td>{number++}</td>
<td>{item.name}</td>
<td>{item.count}</td>
<td>
<button
onClick={() => {
dispatch(addCount(item.id));
}}
>
+
</button>
</td>
<td>
<button onClick={() => dispatch(removeItem(item.id))}>
삭제하기
</button>
</td>
</tr>
</tbody>
))}
이런식으로 코드되어있습니다.
근데 삭제버튼을 누르면 다 삭제되요..
아래처럼 콘솔찍으면 숫자는 잘 출력되고있는데..
혹시 뭐때문일까요?
removeItem(state, action) {
console.log(action.payload);
state.products.map((i) => console.log(current(i)));
return state.products.filter((i) => i.id !== action.payload);
},
원래 구조는
initialState:[
{ id: 0, name: 'White and Black', count: 2 },
{ id: 2, name: 'Grey Yordan', count: 1 },
]
이런식이였습니다. 이런식일때는 잘 동작하던게 ...