//App.tsximport { useDispatch } from 'react-redux';
import { removeItem } from '/src/redux/item';export default function Test() {
const dispatch = useDispatch(); const handleDelete = (label: string) => {
dispatch(removeItem(label));
}; return (
<>
<button type="button"
onClick={() => handleDelete('pc')}
>
Delete PC
</button>
</>
);
}//redux/item.tsxinterface ActionProps {
type: string;
itemName: string;
}const initialState = {
item: [],
};const REMOVE = 'item/REMOVE';export const removeItem = (itemName: string) => ({
type: REMOVE,
itemName
});export default function item(
state = initialState,
action: ActionProps)
{
switch (action.type) {
case REMOVE:
return {
...state,
item: [
...state.item.filter(val => val !== action.itemName)
],
};
default:
return state;
}
}
