Javascript 如何在Vue中管理真正大表单的模型？

我目前正在写一个非常大的多页表单（大约60个字段）。在最后一页，用户将看到一份简历，这样他可以在发送前检查所有数据

它都在一个页面中管理（带有“页面”幻灯片），因此我需要根据用户输入自动填充简历。我用Vue来做，类似这样：

<input name="contact[name]" v-model="name" id="name" type="text" value="" />

好的，一切都好。但我有大约60个字段，我应该将它们全部放入Vue obj的

数据
属性中。相当乏味

因为我是Vue的新手，也许我做得不对。如果是这样，请有人给我指一下正确的方向好吗

我知道我应该问Vue论坛，但他们回答问题的速度真的很慢。
我简化它的方式（按照@JacobGoh的建议）是使用空对象。这对于我的特殊需求来说非常有效。此外，正如您所看到的，当您需要使用监视程序或初始化属性（例如，对于通常需要的选择字段），您可以只显式显示那些相关属性。
我最终得到了大约20个道具，而不是60-70个道具

var vueapp = new Vue({
  el: '#form'
  ,data:{
    form:{
      contact:{}
      ,compiler:{}
      ,project:{}
      ,current_tools:{}
      ,screw:{
        type: "Flat"
        ,drive_shape: "Phillips"
        ,drive_type: 1
        ,has_mobile_washer: 'no'
        ,material: 'Iron'
        ,finish: 'Oil'
      }
      ,tightening:{}
      ,cicle:{}
      // [and so on...]
    }
  }// data
});

我认为你的做法可能是对的。很遗憾，这很乏味。您还可以为这些输入创建一个对象数组（必要时进行分组），然后通过
v-for
生成输入，这样，如果需要添加/删除，您只需在单个位置执行即可。您还可以添加输入类型、验证参数等。您可以将其全部放在一个对象中：但这也限制了对每个值的控制。例如，您不能查看特定的表单值，因为它在用户输入之前不存在something@JacobGoh但是如果你这样做。。。你拥有你可能需要的控制权。您还可以添加更多参数，例如regex字符串等@beu yes。预先定义所有表单数据仍然是最佳实践。最后，我选择了@JacobGoh路线：）谢谢
var vueapp = new Vue({
  el: '#form'
  ,data:{
    name:''
  }
});

var vueapp = new Vue({
  el: '#form'
  ,data:{
    form:{
      contact:{}
      ,compiler:{}
      ,project:{}
      ,current_tools:{}
      ,screw:{
        type: "Flat"
        ,drive_shape: "Phillips"
        ,drive_type: 1
        ,has_mobile_washer: 'no'
        ,material: 'Iron'
        ,finish: 'Oil'
      }
      ,tightening:{}
      ,cicle:{}
      // [and so on...]
    }
  }// data
});