Reactjs 在文本输入和按钮按下后，反应本机待办事项列表不添加新项目

我太糊涂了，我没有别的地方可找了。我在世博会上开发todo应用程序时遇到问题。我所需要做的就是将功能添加到当您在文本框中输入文本并按下按钮时，它会将一个项目添加到列表中

这是我所有的代码

import React from 'react';
import { StyleSheet, SafeAreaView, FlatList, TextInput, View } from 'react-native';
import {Card, CheckBox, Button} from 'react-native-elements';


export default function App() {
  const [addListItem, OnChangeText] = React.useState("Insert new Item")
  
  function addTodoItem() {
    React.setState(prevState => ({
      data: [...prevState.data, 
      {completed: false, description: <TextInput/>, key: prevState.curKey}],
      curKey:prevState.curKey+1
    }))
  } 
  let [data, setData] = React.useState( 
  [
    {
      key: "1",
      description: "Do Dishes",
      completed: false
    },
    {
      key: "2",
      description: "Clean Living Room",
      completed: false
    },
  ])

  let renderItem = ({item}) => {
    return <>
      <CheckBox 
        center
        title={item.description}
        checked={item.completed}
        onPress={() => {

          let newData = [...data]
          let itemToLookFor = newData.find((item2) => item.key == item2.key)
          itemToLookFor.completed = !itemToLookFor.completed
          setData(newData)
        }}
        textStyle={item.completed ? {textDecoration: "line-through"} : undefined}
      />
    </>
  }

/* addTodoItem = () => {

} */

  return (
    <View>
      <SafeAreaView style={styles.container}>
      <Card>
        <Card.Title>TODO APP</Card.Title>
        <Card.Divider/>
         <FlatList data={data} renderItem={renderItem}></FlatList>
        <Card.Divider/>
        <TextInput
          onChangeText={OnChangeText}
          value={addListItem}
        />
        <Button
          title="+"
          onPress={addTodoItem()}
        />
      </Card>
    </SafeAreaView>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
  text: {
    color: 'darkred',
  }
});

从“React”导入React；
从“react native”导入{样式表、安全区域视图、平面列表、文本输入、视图}；
从“react native elements”导入{Card，CheckBox，Button}；
导出默认函数App（）{
const[addListItem，OnChangeText]=React.useState（“插入新项”）
函数addTodoItem（）{
React.setState（prevState=>({
数据：[…prevState.data，
{已完成：false，description:，key:prevState.curKey}]，
curKey:prevState.curKey+1
}))
} 
let[data，setData]=React.useState（
[
{
关键：“1”，
描述：“洗碗”，
已完成：false
},
{
键：“2”，
描述：“清洁客厅”，
已完成：false
},
])
让renderItem=（{item}）=>{
返回
{
让newData=[…data]
让itemtookfor=newData.find（（item2）=>item.key==item2.key）
itemToLookFor.completed=！itemToLookFor.completed
setData（新数据）
}}
textStyle={item.completed？{textDecoration:“行通过”}：未定义}
/>
}
/*addTodoItem=（）=>{
} */
返回(
待办事项应用程序
);
}
const styles=StyleSheet.create({
容器：{
弹性：1，
背景颜色：“#fff”，
对齐项目：“居中”，
为内容辩护：“中心”，
},
正文：{
颜色：“暗色”，
}
});

---

如果您能提供任何帮助，我将不胜感激，因为我还没有反应过来，所以答案可能很简单。

示例中似乎有一些问题。我会一个接一个地看。您也可以在这里找到工作零食：

React.setState

——此挂钩不存在。这是您在其他地方导入或定义的自定义内容吗？您可能希望重写

addTodoItem

以使用

setData

：

将

addToDoItem

传递到您的按钮，而不调用它：

然后，您还需要清除

addTodoItem

回调中的

addListItem

：

  OnChangeText("");

<Button
  title="+"
  onPress={addTodoItem}
/>

const [addListItem, OnChangeText] = React.useState("")
...
<TextInput
  onChangeText={OnChangeText}
  placeholder="Insert new Item"
  value={addListItem}
/>

  OnChangeText("");