如何在React状态下更新对象?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (72)

我有一个usersJS对象(不是数组)的索引列表。它是React状态的一部分。

{
    1: { id: 1, name: "John" }
    2: { id: 2, name: "Jim" }
    3: { id: 3, name: "James" }
}

最佳做法是:

  1. 添加id为(4)的新用户{id:4,名称:“Jane”}为关键字
  2. 删除ID为2的用户
  3. 将用户#2的名称更改为“Peter”

没有任何不变的帮手。我正在使用Coffeescript和Underscore(所以_.extend可以......)。

提问于
用户回答回答于

如果你没有使用Flux,你可以使用this.setState()来更新状态对象。

delUser(id) {
    const users = this.state.users;
    delete users[id];
    this.setState(users);
}

addChangeUser(id, name) {
    const users = this.state.users;
    users[id] = {id: id, name: name};
    this.setState(users);
}

然后你可以用这个来执行你的测试用例:

addChangeUser(4, 'Jane);
addChangeUser(2, 'Peter');
delUser(2);
用户回答回答于

这是我会做的

  • 加: var newUsers = _.extend({}, users, { 4: { id: 4, ... } })
  • 删除:var newUsers = _.extend({}, users)然后delete newUsers['2']
  • 改变:var newUsers = _.extend({}, users)然后newUsers['2'].name = 'Peter'

扫码关注云+社区

领取腾讯云代金券