如何在Reactjs中使用搜索栏过滤表格行

import React, { Component } from 'react';

class TableFilter extends Component {
  constructor(props) {
    super(props);
    this.state = {
      searchText: ''
    };
  }

  handleSearchTextChange = (event) => {
    this.setState({ searchText: event.target.value });
  }

  render() {
    const { searchText } = this.state;
    const { data } = this.props;

    const filteredData = data.filter(item => {
      return item.name.toLowerCase().includes(searchText.toLowerCase());
    });

    return (
      <div>
        <input type="text" value={searchText} onChange={this.handleSearchTextChange} placeholder="Search..." />
        <table>
          <thead>
            <tr>
              <th>Name</th>
              <th>Age</th>
              <th>Email</th>
            </tr>
          </thead>
          <tbody>
            {filteredData.map(item => (
              <tr key={item.id}>
                <td>{item.name}</td>
                <td>{item.age}</td>
                <td>{item.email}</td>
              </tr>
            ))}
          </tbody>
        </table>
      </div>
    );
  }
}

export default TableFilter;