从状态数组中删除项中状态的含义- useReducer

function reducer(state, action) {
  switch (action.type) {
    case 'DELETE_ITEM':
      return state.filter(item => item.id !== action.payload);
    default:
      return state;
  }
}

import React, { useReducer } from 'react';

function MyComponent() {
  const initialState = [
    { id: 1, name: 'Item 1' },
    { id: 2, name: 'Item 2' },
    { id: 3, name: 'Item 3' }
  ];

  function reducer(state, action) {
    switch (action.type) {
      case 'DELETE_ITEM':
        return state.filter(item => item.id !== action.payload);
      default:
        return state;
    }
  }

  const [state, dispatch] = useReducer(reducer, initialState);

  function handleDeleteItem(id) {
    dispatch({ type: 'DELETE_ITEM', payload: id });
  }

  return (
    <div>
      {state.map(item => (
        <div key={item.id}>
          <span>{item.name}</span>
          <button onClick={() => handleDeleteItem(item.id)}>Delete</button>
        </div>
      ))}
    </div>
  );
}