卸载屏幕后重置状态 - 挂钩？

Question

从 API 获取数据后，我将其设置为状态，并在 Flatlist 中呈现项目，当我从中选择任何项目时，我会操作数据并向名为“toggle: true”的项目对象添加一个新属性当我从列表中选择任何项目时效果很好，我添加了一个基于的边框toggle，但是当我返回上一个屏幕然后重新打开列表屏幕时，我可以看到在项目周围呈现的边框，尽管我在卸载时重置了状态屏幕那么我在这里犯了什么错误？代码片段数据export default {  ...  services: [    {      id: 0,      name: 'nameS0',      logo:        'https://cdn2.iconfinder.com/data/icons/hotel-98/64/hair-dryer-tools-beauty-hairdressing-512.png',      price: 19.99,    },    ],  employees: [    {      id: 0,      name: 'name0',      img:        'https://www.visualelementmedia.com/wp-content/uploads/2015/04/person-4-400x629.jpg',    },    ...  ],};const VendorProfile = ({navigation}) => {  const [services, setServices] = React.useState(null);  const [employees, setEmployees] = React.useState(null);  const [serviceSelected, setServiceSelected] = React.useState(null);  const [employeeSelected, setEmployeeSelected] = React.useState(null);    // For selected Item (services, employees)  const itemSelected = (data, id) => {    const updated = data.map((item) => {      item.toggle = false;      if (item.id === id) {        item.toggle = true;        data === services          ? setServiceSelected(item)          : setEmployeeSelected(item);      }      return item;    });    data === services ? setServices(updated) : setEmployees(updated);  };  ...  const renderEmployees = ({item}) => {    return (      <TouchableOpacity        onPress={() => itemSelected(employees, item.id)}        delayPressIn={0}        style={styles.employeeContainer}>        <EmployeePattern style={{alignSelf: 'center'}} />        <View style={styles.employeeLogo}>          <Image            source={{uri: item.img}}            style={[styles.imgStyle, {borderRadius: 25}]}          />    );  };

Answer 1

好吧，在尝试了多次之后，我明白了

改变这个

 const updated = data.map((item) => {

对此

 const updated = data.map((old) => {
       let item = {...old};

请确保一切正常，我们没有破坏任何东西 :)

在您的 ItemSelected 函数上，您传递了整个员工列表，现在可以通过它了，但是当您更改此列表中的一个项目而不“重新创建它”时，对该项目的引用仍然是相同的“因为它是一个对象”的意思我们正在修改原始项目，并且由于我们这样做，项目保留了它的旧引用，避免这种情况的最佳方法是重新创建对象，希望这能给你一个想法。