对象声明

Question

我有一个用于更新文档实体的表格。

文档实体由员工列表（是一组对象）组成，每个员工都有一个仅是字符串的帖子。

我有一个下拉列表（vue-multiselect的包装器类型），它接受员工数组并将所选员工同步到selectedEmployee中的data()变量。

我还有selectedEmployee的观察者，当在下拉列表中选择雇员时，它会自动设置post输入。

因此，当以这种形式创建文档时，一切都很好，但是，当我更新文档时，便从服务器获取了现有文档，设置了selectedEmployee并设置了员工的职位。但是，文档也保留了员工的职位，因此，当我第一次打开文档的表单进行更新时，我不想自动更新文档的职位。我希望仅在用户实际选择员工时才对其进行更新。

但是观察者也第一次被打来。

因此，假设我们有John Doe和他的经理。创建文档时，我将其职位更改为设计师。然后，我打开文档表单进行更新，我应该看到对于该特定文档，John Doe的帖子是“ designer”，但是监视者被调用并将该帖子返回给经理。

我试图在data（）中创建一个伪变量，例如doneFetching，但是只有当我直接在watcher中更新此var时，它才起作用，这看起来非常危险，另外，在其他实体中，我有很多不同的种类选定的员工，因此不要制造大量的假旗。

这是真实的代码示例（在我的情况下，员工=代表）：

  selectedApproveRepresentative(representative) {
    if (!representative) {
      this.memoData.approve_representative_id = null
      return
    }

    this.memoData.approve_representative_id = representative.id

    // Here is temporary solution, but I have many watchers for many different kinds of employees. If I move the doneFetching flag after I initialized the form, it'll be set to true, and only after that the watcher will be called
    if (this.mode === 'update' && !this.doneFetching) {
      this.doneFetching = true
      return
    }

    // In normal case a representative might have or have not post, so depending on this case we set it to be empty or filled. But this should not be called the first time I open the form
    this.memoData.approve_representative_post_dative_case =
      representative.post_dative_case ?
      representative.post_dative_case : ''
  },

这是我初始化数据的地方：

created() {
  if (this.memo) {
    this.memoData = _.cloneDeep(this.memo)
    this.selectedApproveRepresentative   = _.cloneDeep(this.memo.approve_representative)

  }
},

Answer 1

据我了解，您的问题是初始化组件时执行的观察程序。您是否尝试将观察者的即时属性设置为false？

并非所有人都知道可以以不同的方式定义观察者。

每个人都知道的简单

watchers: {
   propertyToWatch() { //code... }
}

将函数名称作为“字符串”传递

watchers: {
   propertyToWatch: 'nameOfAfunctionDefinedInMethodsSection'
}

对象声明

这是声明观察者的最具描述性的方式。您可以将其写为具有处理程序属性的对象（它可以是如上所述作为字符串传递的函数的名称），还可以使用其他属性（例如deep来监视对象的嵌套属性，或者以您的情况{{1 }}，它会告知观察者组件安装后是否应立即运行。

immediate

在vueJS中跳过监视程序

1 个答案:

每个人都知道的简单

将函数名称作为“字符串”传递

对象声明