如何使用TypeScript中React useState中的新值更新数组中object中的键的值

import React, { useState } from 'react';

interface Item {
  id: number;
  name: string;
}

const App: React.FC = () => {
  const [items, setItems] = useState<Item[]>([
    { id: 1, name: 'Item 1' },
    { id: 2, name: 'Item 2' },
    { id: 3, name: 'Item 3' },
  ]);

  const updateItemName = (id: number, newName: string) => {
    setItems(prevItems =>
      prevItems.map(item =>
        item.id === id ? { ...item, name: newName } : item
      )
    );
  };

  return (
    <div>
      {items.map(item => (
        <div key={item.id}>
          {item.name}
          <button onClick={() => updateItemName(item.id, 'Updated Name')}>
            Update
          </button>
        </div>
      ))}
    </div>
  );
};

export default App;