javascript - 关于 : Vue. js 操作/突变的澄清

Question

我需要一些澄清:这些函数之间的相互作用。我正在学习 Vue.js 教程，并且我们有一个提交突变的操作。

行动:

updateUser({commit}, user) {
  commit('setUser', {userId: user['.key'], user})
}

突变:

setUser(state, {user, userId}) {
  Vue.set(state.users, userId, user)
}

我的问题是关于操作中 commit() 调用中参数的顺序。有效负载是一个对象，其第一个名称-值对是 userId，第二个值是用户对象本身。现在，在突变定义中，突变期望的有效负载中的值被颠倒了。我无法想象 JavaScript/Vue 如何知道 setUser 定义中期望的数据类型，以便预期有效负载中名称-值对的顺序无关紧要。那么为什么该应用程序仍然有效？突变是否期望接收名为 user 和 userId 的变量，这就是顺序无关紧要的原因？

Answer 1

它与 Vue 无关，而是一个 Javascript destructuring句法;顺序并不重要，因为它是通过键从对象中提取值；在您的情况下， setUser 需要一个包含键 user 和键 userId 的对象，该对象由 updateUser< 传递下来 行动；另请注意，这只是一个语法糖，您不必遵循，也就是说，您可以编写接受普通对象作为参数的突变，如下所示:

setUser(state, obj) {
  Vue.set(state.users, obj.userId, obj.user)
}