使用React钩子更新状态数组的所有对象元素

import React, { useState } from 'react';

const [items, setItems] = useState([
  { id: 1, name: 'Item 1' },
  { id: 2, name: 'Item 2' },
  { id: 3, name: 'Item 3' }
]);

const updateItems = () => {
  setItems(items.map(item => ({
    ...item,
    name: 'Updated ' + item.name
  })));
};

<button onClick={updateItems}>Update Items</button>

import React, { useState } from 'react';

const MyComponent = () => {
  const [items, setItems] = useState([
    { id: 1, name: 'Item 1' },
    { id: 2, name: 'Item 2' },
    { id: 3, name: 'Item 3' }
  ]);

  const updateItems = () => {
    setItems(items.map(item => ({
      ...item,
      name: 'Updated ' + item.name
    })));
  };

  return (
    <div>
      {items.map(item => (
        <div key={item.id}>{item.name}</div>
      ))}
      <button onClick={updateItems}>Update Items</button>
    </div>
  );
};

export default MyComponent;