如何在输入中显示选中行的信息？

// 使用React框架的示例
import React, { useState } from 'react';

const Table = ({ data }) => {
  const [selectedRow, setSelectedRow] = useState(null);

  const handleRowClick = (row) => {
    setSelectedRow(row);
  };

  return (
    <div>
      <table>
        <tbody>
          {data.map((row, index) => (
            <tr key={index} onClick={() => handleRowClick(row)}>
              <td>{row.name}</td>
              <td>{row.age}</td>
            </tr>
          ))}
        </tbody>
      </table>
      {selectedRow && (
        <div>
          <h3>Selected Row:</h3>
          <p>Name: {selectedRow.name}</p>
          <p>Age: {selectedRow.age}</p>
        </div>
      )}
    </div>
  );
};

export default Table;

// 使用React框架的示例
import React, { useState } from 'react';

const Table = ({ data }) => {
  const [selectedRows, setSelectedRows] = useState([]);

  const handleRowClick = (row) => {
    if (selectedRows.includes(row)) {
      setSelectedRows(selectedRows.filter(r => r !== row));
    } else {
      setSelectedRows([...selectedRows, row]);
    }
  };

  return (
    <div>
      <table>
        <tbody>
          {data.map((row, index) => (
            <tr key={index} onClick={() => handleRowClick(row)}>
              <td>{row.name}</td>
              <td>{row.age}</td>
            </tr>
          ))}
        </tbody>
      </table>
      {selectedRows.length > 0 && (
        <div>
          <h3>Selected Rows:</h3>
          <ul>
            {selectedRows.map((row, index) => (
              <li key={index}>
                Name: {row.name}, Age: {row.age}
              </li>
            ))}
          </ul>
        </div>
      )}
    </div>
  );
};

export default Table;