更改listview的特定图像

import React, { useState } from 'react';

const ListView = () => {
  const [items, setItems] = useState([
    { id: 1, name: 'Item 1', image: 'image1.jpg' },
    { id: 2, name: 'Item 2', image: 'image2.jpg' },
    { id: 3, name: 'Item 3', image: 'image3.jpg' },
  ]);

  const changeImage = (itemId) => {
    const updatedItems = items.map((item) => {
      if (item.id === itemId) {
        return { ...item, image: 'newImage.jpg' };
      }
      return item;
    });

    setItems(updatedItems);
  };

  return (
    <ul>
      {items.map((item) => (
        <li key={item.id}>
          <span>{item.name}</span>
          <img src={item.image} alt={item.name} />
          <button onClick={() => changeImage(item.id)}>Change Image</button>
        </li>
      ))}
    </ul>
  );
};

export default ListView;