Question

不是什么问题，而是更多的解决方案：

如果您一直在遵循有关如何使用Vue和Vuelidate创建模式驱动的表单的精彩教程，则：

这对于一页上的表单很好用。但是，我创建了一个多阶段的表单，每个步骤都在新页面上，表单对象随着您逐步执行而建立，并且遇到了一个问题，该问题花费了数天的时间在Internet上寻找答案。所以我想把它放在那儿，以帮助任何发现自己处在相同情况下的人。

问题： 验证可以在第一页上正常进行，但是一旦您移至第二页，则只要在字段中键入一个字符，验证就会中断。就我而言，即使您正确填充了该字段，它也会显示“此字段是必填字段”。无需键入任何内容即可唤醒验证器以重新评估输入。

解决方案 在本教程的DynamicForm组件中，它说要创建“ update”函数，如下所示：

update (key, value) {
  this.form[key] = value

  this.$emit('input', {
    ...this.value,
    [key]: value
  })
}

这里发生的是this.form [key] =值实际上并未在Vue中设置反应性。因此，它可以正确设置该值，并且一切看起来都应该可以正常工作，但是Vue不知道它是反应性的，因此在更改时不会触发验证。

有关vue.set的更多信息，请参见本文：

因此，要解决此问题，只需从上面显示的“更新”功能更改以下行：

this.form[key] = value

为此：

this.$set(this.form, key, value);

和魔术一样，Vue突然意识到这是反应性的，因此当您在该字段中输入数据时，后台必要的暗魔术也会在后台重新运行验证。

这是一个相当小众的问题，但是希望这可以帮助某个人避免我浪费时间来弄清楚这个问题。