當我按下 Flatlist 數據中的任何項目時，我正在實現一些清單組件，我向對象添加了一個切換屬性并制作它true并基于它我呈現了一個檢查綠色圖標，但在這種情況下，Flatlist，而不是重新渲染，我為 Flatlist 添加了 extraData 道具并將數據傳遞給它，但效果不佳！這是代碼import React, {useState} from 'react';import {StyleSheet, Text, View, FlatList, TouchableOpacity} from 'react-native';import Feather from 'react-native-vector-icons/Feather';import {Theme} from '../utils/colors';const Data = [  {    id: 1,    first_name: 'Sile',  },  {    id: 2,    first_name: 'Clementia',  },  {    id: 3,    first_name: 'Brita',  },  {    id: 4,    first_name: 'Duke',  },  {    id: 5,    first_name: 'Hedvig',  }];const BottomModal = () => {  const [countries, setCountries] = useState(Data);  const itemSelected = (id) => {    console.log('current id: ', id);    let datamanipulat = countries;    datamanipulat.map((item) => {      item.toggle = false;      if (item.id === id) {        item.toggle = true;      }    });    setCountries(datamanipulat);    console.log('data after manipulate: ', countries);  };  return (    <View style={styles.container}>      <FlatList        ListHeaderComponent={() => (          <View style={styles.header}>            <View style={styles.panelHandle} />          </View>        )}        showsVerticalScrollIndicator={false}        data={countries}        extraData={countries}        keyExtractor={(item) => String(item.id)}        renderItem={({item, index}) => (          <TouchableOpacity            key={item.id}            onPress={() => itemSelected(item.id)}            style={styles.item}>            <Text>{`country: ${item.first_name}`}</Text>            {item.toggle ? (              <Feather name="check" size={25} color={Theme.PrimaryColor} />            ) : (              <Feather name="octagon" size={25} color={Theme.PrimaryColor} />            )}          </TouchableOpacity>        )}        contentContainerStyle={styles.contentContainerStyle}      />