export default function App() {
  const [toDoList, setToDoList] = React.useState([
    { task:'dishes', id:'1'},
    { task:'laundry', id:'2'},
    { task:'dishes', id:'3'},
    { task:'laundry', id:'4'},
    { task:'dishes', id:'5'},
  ])

  const [inputText, setText] = React.useState('');

  return (
    <View style={styles.container}>
      <TextInput
        style={styles.input}
        onChangeText={newText => setText(newText)}
        value={inputText}
        placeholder='Input Task'
      />
      
      <TouchableOpacity onPress={() => {
        index = toDoList.length + 1
        toDoList.push({ task: {inputText}, id:{index} })
        setToDoList(...toDoList)
      }}>
        <Text style={styles.item}>Add Task</Text> 
      </TouchableOpacity>
      
      <FlatList
      data={toDoList}
      extraData={toDoList}
      renderItem= {({ item }) => ( <Text style={ styles.item }>{item.task}</Text>)}/>
    </View>
  );
}

我希望它在单击“AddItem”按钮时向平面列表添加一个新项，并且它应该从TextInput组件获取任务。然而，当我尝试它时，它不会以任何方式更新FlatList。为什么会这样？我认为这可能是一个问题，与toDoList没有正确更新，但我不确定。