react添加新的数组方法，根据数组的键返回数组的对象项

import React from 'react';

const data = [
  { id: 1, name: 'Apple', category: 'Fruit' },
  { id: 2, name: 'Banana', category: 'Fruit' },
  { id: 3, name: 'Carrot', category: 'Vegetable' },
  { id: 4, name: 'Tomato', category: 'Vegetable' },
];

const App = () => {
  // 根据数组的键返回数组的对象项
  const getItemsByCategory = (category) => {
    return data.filter(item => item.category === category);
  };

  const fruitItems = getItemsByCategory('Fruit');
  const vegetableItems = getItemsByCategory('Vegetable');

  return (
    <div>
      <h2>Fruits:</h2>
      <ul>
        {fruitItems.map(item => <li key={item.id}>{item.name}</li>)}
      </ul>

      <h2>Vegetables:</h2>
      <ul>
        {vegetableItems.map(item => <li key={item.id}>{item.name}</li>)}
      </ul>
    </div>
  );
};

export default App;