Reaction-更新状态(对象数组)。我是否需要深入复制阵列?

2022-02-22 00:00:00 reactjs javascript react-hooks

我有以下state

const[images,setImages] = useState([
  {src: 'stringSRC1', selected: false},
  {src: 'stringSRC2', selected: false},
  {src: 'stringSRC3', selected: false}
]);

我正在使用以下代码更新它(切换选定状态):

function handleImageClick(index) {
  props.setImages((prevState)=>{
    const aux = Array.from(prevState);
    aux[index].selected = !aux[index].selected;
    return aux;
  });
}

它按预期工作。但是我想到了一件事。

当我从prevState复制数组时,我创建了一个新数组,但对象(存储为引用)将保持不变。我已测试过,以这种方式复制数组时它们不会更改。

问题

这是不是一种糟糕的做法?我是否应该像创建新数组和创建全新对象那样,费心深入复制数组呢?还是这样就好了?


解决方案

不,它应该是这样工作的。是的,对象没有改变,但这里重要的是数组改变了。到目前为止,当情况发生变化时,Reaction在DOM和虚拟DOM之间执行浅显的比较。一旦将新数组与旧数组进行比较,就会检测到更改,数组本身的内容实际上并不重要。

相关文章