如何在轻击行中的按钮时将列表中的选定对象传递给第二个视图

// 列表组件
import React, { useState } from 'react';

const ListComponent = () => {
  const [selectedItem, setSelectedItem] = useState(null);

  const handleButtonClick = (item) => {
    setSelectedItem(item);
  };

  return (
    <div>
      {listData.map((item) => (
        <div key={item.id}>
          <span>{item.name}</span>
          <button onClick={() => handleButtonClick(item)}>点击按钮</button>
        </div>
      ))}
    </div>
  );
};

export default ListComponent;

// 第二个视图组件
import React from 'react';

const SecondViewComponent = ({ selectedItem }) => {
  return (
    <div>
      <h2>第二个视图</h2>
      {selectedItem && <p>选定对象：{selectedItem.name}</p>}
    </div>
  );
};

export default SecondViewComponent;