我明天需要完成一个项目（我还在学习编程），我不能创建一个函数，可以动态地添加新的项目到一个平面列表，然后重新呈现该平面列表。如果有人能告诉我该怎么做或写一个简单的代码来做这个函数，我会很高兴（我已经试着思考这个问题2天了，我不能再做了）。

import { useEffect, useState } from "react";
import { Text, View, SafeAreaView, FlatList, StyleSheet, StatusBar, Button, Alert, TextInput, Image, TouchableOpacity, Modal } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import React from 'react';

const styleList = StyleSheet.create({
  container: {
    flex: 1,
    marginTop: StatusBar.currentHeight || 0,
  },
  item: {
    padding: 20,
    marginVertical: 8,
    marginHorizontal: 16,
  },
  title: {
    fontSize: 32,
  },
});


const DATA = [
  {
    id: "1",
    name: "Strawberry",
    price: 1.25,
    imageurl: "https://static.wikia.nocookie.net/esharrypotter/images/7/76/Fresa.jpg/revision/latest?cb=20200713112301",

    
  },
  {
    id: "2",
    name: "Kiwi",
    price: 1.40,
    imageurl: "http://www.frutas-hortalizas.com/img/fruites_verdures/presentacio/14.jpg",
  },
  {
    id: "3",
    name: "Banana",
    price: 1.50,
    imageurl: "https://images.heb.com/is/image/HEBGrocery/000377497?fit=constrain,1&wid=800&hei=800&fmt=jpg&qlt=85,0&resMode=sharp2&op_usm=1.75,0.3,2,0",
  },
];

const Tab = createBottomTabNavigator();

export default function App() {
  return (
    <NavigationContainer>
      <Tab.Navigator>
        <Tab.Screen name="Home" component={ListScreen} />
        <Tab.Screen name="Post" component={PostScreen} />
        <Tab.Screen name="Remove/Update" component={RemUpdScreen} />
      </Tab.Navigator>
    </NavigationContainer>
  );
}

function ListScreen() {
  const renderItem = ({item}) => (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>

      <Image
      source={{uri: item.imageurl}}
      style = {{width: 200, height: 200, margin: 20}}>
      </Image>

      <Text style={{fontWeight: 'bold',fontSize: 20}}>{item.name+ " | " + item.price}</Text>
      
      
      

    </View>
  )

  return (
  <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
    <FlatList 
    data = {DATA}
    renderItem={renderItem}
    keyExtractor={item=>item.id}
    />
  </View>
  )
  
  }

function PostScreen() {

  const [name, onChangename] = React.useState('');
  const [price, onChangeprice] = React.useState('');

  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>

  

      <TextInput
       
        onChangeText={onChangename}
        value={name}
        placeholder="new name"
      />
      <TextInput
       
        onChangeText={onChangeprice}
        value={price}
        placeholder="new price"
        keyboardType="numeric"
      />

      <Button
       onPress={() => PostFruit(name,price)}
        title="ADD"
        color="#777767"

      />

    </View>
  );
 
}

需要写在“PostFruit”的代码，可以让我添加到平面列表的项目。