Question

我有一个用户列表，更新后我这样处理

handleUserUpdated = (user) => {
  let users = this.state.users.slice();
  for (let i = 0, n = users.length; i < n; i++) {
    if (users[i]._id === user._id) {
      users[i].title = user.title;
      users[i].artist = user.artist;
      users[i].published_date = user.published_date;
      break; // Stop this loop, we found it!
    }
  }
  this.setState({ users: users });
}

我发现这种方法存在缺陷，我必须始终声明属性并使用break让我觉得上面的代码很难看。有更好的方法吗？

不确定这是否正确。

this.setState({ users: users.map(o => o.id === user.id ? Object.assign({}, user, {...user}) : o ) })

Answer 1

也许更简洁的方法是：

users.map(o => o.id === user.id
  ? {...o, ...user}
  : o
)

最大的问题是你无法控制你所放置的东西......原件可能有你不再需要的属性，不会被覆盖。

您可以考虑采取以下措施：

const index = users.findIndex(o => o.id == user.id)
const newUsers = Object.assign([], users, {[index]: user});

Working example

或者

const index = users.findIndex(o => o.id == user.id)
const newUsers = [
  ...users.slice(0, index),
  user,
  ...users.slice(index + 1)
]

多种方式处理对象数组的更新响应

1 个答案: