如何在ReactNative(JS)中删除列表中的特定元素

import React, { useState } from 'react';
import { View, Text, FlatList, Button } from 'react-native';

const App = () => {
  const [listData, setListData] = useState([
    { id: 1, name: '元素1' },
    { id: 2, name: '元素2' },
    { id: 3, name: '元素3' },
    // 其他元素...
  ]);

  // 删除特定元素的函数
  const deleteItem = (itemId) => {
    const updatedList = listData.filter(item => item.id !== itemId);
    setListData(updatedList);
  };

  return (
    <View>
      <FlatList
        data={listData}
        keyExtractor={(item) => item.id.toString()}
        renderItem={({ item }) => (
          <View>
            <Text>{item.name}</Text>
            <Button title="删除" onPress={() => deleteItem(item.id)} />
          </View>
        )}
      />
    </View>
  );
};

export default App;