如何使用React/Redux更新存储中的特定对象？

// actions.js
export const UPDATE_ITEM = 'UPDATE_ITEM';

export const updateItem = (id, updatedData) => ({
  type: UPDATE_ITEM,
  payload: { id, updatedData }
});

// reducer.js
import { UPDATE_ITEM } from './actions';

const initialState = {
  items: [] // 假设items是一个对象数组
};

const rootReducer = (state = initialState, action) => {
  switch (action.type) {
    case UPDATE_ITEM:
      return {
        ...state,
        items: state.items.map(item =>
          item.id === action.payload.id ? { ...item, ...action.payload.updatedData } : item
        )
      };
    default:
      return state;
  }
};

export default rootReducer;

// MyComponent.js
import React from 'react';
import { useSelector, useDispatch } from 'react-redux';
import { updateItem } from './actions';

const MyComponent = () => {
  const items = useSelector(state => state.items);
  const dispatch = useDispatch();

  const handleUpdate = (id, newData) => {
    dispatch(updateItem(id, newData));
  };

  // 假设有一个列表渲染items，并且每个项都有一个编辑按钮
  return (
    <div>
      {items.map(item => (
        <div key={item.id}>
          {/* 渲染item的内容 */}
          <button onClick={() => handleUpdate(item.id, { /* 新的数据 */ })}>
            编辑
          </button>
        </div>
      ))}
    </div>
  );
};

export default MyComponent;