刷新 FlatList 反应

Question

删除工作后未显示在屏幕项目上的flatList不会改变

        const App = () => {
          const data = [
            { id: 1, text: "item One" },
            { id: 2, text: "item Two" },
            { id: 3, text: "item Three" },
            { id: 4, text: "item Four" },
          ];

          const [state, setState] = useState(data);

          const onPressItem = (id) => {
            // code de delete item
            const data = state;

            alert(id);
          const filterrArray = data.filter((val, i) => {
              if (val.id !== id) {
                return val;
              }
            });
            console.log("filteerArray " , filterrArray)
            setState( filterrArray)
          };
          const renderItem = ({ item }) => {
            return (
              <TouchableOpacity style={styles.item}>
                <Text style={styles.text}>{item.text}</Text>
                <Button title="Supprimer" onPress={() => onPressItem(item.id)} />
              </TouchableOpacity>
            );
          };


          const handleCheck = () => { 
            console.log('__________________________')
            console.log(state)
          }
          return (
            <View style={{ flex: 1, padding: 0, marginTop: "10%" }}>
              <SafeAreaView>
                <FlatList
                  data={data}
                  keyExtractor={(item) => item.id}
                  renderItem={renderItem}
                />
              </SafeAreaView>

              <Button
              title = "Verifier state"

              onPress={handleCheck}
              /> 
            </View>
          );
        };

我每次在删除之前和之后尝试控制台日志都可以正常工作，但不会在屏幕上更改或自动刷新我不知道

Answer 1

不确定我的问题是否正确，但如果您想更新平面列表，则需要将状态传递给数据。 data={state}