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

本教程将介绍Reaction-更新状态(对象数组)。我是否需要深入复制阵列?的处理方法,这篇教程是从别的地方看到的,然后加了一些国外程序员的疑问与解答,希望能对你有所帮助,好了,下面开始学习吧。

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

问题描述

我有以下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之间执行浅显的比较。一旦将新数组与旧数组进行比较,就会检测到更改,数组本身的内容实际上并不重要。

好了关于Reaction-更新状态(对象数组)。我是否需要深入复制阵列?的教程就到这里就结束了,希望趣模板源码网找到的这篇技术文章能帮助到大家,更多技术教程可以在站内搜索。