Vue2如何在vue实例中创建动态数据字段以进行表单验证答案

【问题标题】：Vue2 how to create dynamic data field in vue instance for form validationVue2如何在vue实例中创建动态数据字段以进行表单验证
【发布时间】：2017-08-15 00:41:45
【问题描述】：

我是 Vue.js 的新手，我正在尝试对动态创建的表单进行表单验证。输入字段是通过从 ajax 调用获得的 json 对象确定的。我环顾四周，发现了很多表单验证库，但它们似乎都需要 vue 实例中的静态数据属性才能使验证部分工作。例如

...
data() {
  return {
    name: '',
    age: '',
    ...
  }
}
...

但由于我的表单中的字段依赖于 json 对象，我无法在数据中硬编码这些值。我想尝试的一种方法是遍历 json 对象，获取一个唯一的键值（如字段名称），将其与一个空值配对，然后将该对象存储在一个数据变量中，我将其传递到vue 实例。但这也取决于每个输入字段都有一个唯一的名称（如果有多个名为“名字”的字段都是必需的呢？）。

这是正确的方法吗？还是我缺少一些基本概念？如果我需要提供更多关于此的信息，请告诉我！谢谢。

我的设置：main.js（实例化 vue 实例并调用 App.js，它是一个组件）--> App.js 包含数据字段，以及调用所有其他组件（例如输入字段、单选按钮、复选框等），具体取决于 json 对象中的哪些

【问题讨论】：

标签： javascript json forms validation vue.js

【解决方案1】：

你可以试试Vue.set：

onload: function(data) {
    for(var i in data) {
        Vue.set(this, i, data[i]);
    }
}

API Documentation

【讨论】：