筛选对象数组并设置为状态数组变量

import React, { useState } from 'react';

const App = () => {
  const data = [
    { key: 'A', value: 1 },
    { key: 'B', value: 2 },
    { key: 'C', value: 3 },
    { key: 'D', value: 4 },
  ];

  const [filteredData, setFilteredData] = useState([]);

  const filterData = () => {
    const filteredArray = data.filter((item) => item.value > 2);
    setFilteredData(filteredArray);
  };

  return (
    <div>
      <button onClick={filterData}>Filter Data</button>
      {filteredData.map((item) => (
        <div key={item.key}>{item.key}</div>
      ))}
    </div>
  );
};

export default App;