React Native 使用扩散运算符设置状态会更新状态,而设置同一对象不会更新状态

toiithl6  于 2023-01-18  发布在  React
关注(0)|答案(2)|浏览(122)

我有一个名为initUser的初始对象,它由用户的初始字段组成,如下所示

const initUser: UserProfile = {
    firstName: '',
    lastName: '',
    phone: '',
    email: '',
    // and so on
};

这个对象很大,它有30多个字段,所以在重新初始化状态时,我这样做了

setUser(initUser);

但没有成功。
但当我这么做的时候

setUser({...initUser});

它开始工作了,尽管spread操作符非常昂贵,因为它要复制变量,所以知道为什么传递变量不起作用吗?
PS:initUser被放置在另一个文件中,并正确导入,因为它在扩展操作符中工作正常。

nwo49xxi

nwo49xxi1#

React只会在状态对象的引用更新时更新。由于Object.is(initUser, initUser); // true React会跳过更新,因为它认为没有任何更改。
使用扩散操作符创建新对象,从而创建新引用。
spread操作符非常便宜,因为它创建了一个浅副本,initUser中的所有对象都将保留它们的引用。

zy1mlcev

zy1mlcev2#

对象中的30个字段并不是很大:)首先,您可以像这样初始化状态[state,setState] = useState(initObject)
然后,当您需要更新状态而不改变is时,您可以按照下面的指南操作:更新状态为-https://beta.reactjs.org/learn/updating-objects-in-state的对象
最后,当您编写setUser({... initUser});- 〉它实际上克隆到一个新对象,这就是为什么你看到的变化:)

相关问题