基于问卷调查需求vue给v-model动态绑定变量

欢迎观看，有帮助可以关注一下公众号：前端资源网 领取免费资料及学习视频

需求：
做一个问卷调查的页面，为了可以重复使用需要动态根据后台的数据动态判断当前位置该使用单行文本输入、多行文本输入、复选框、还是单选框，页面基于vue 3.0写的。后台的数据结构大概是这样的(模拟数据)

listData: [{
  type: 'text',
  label: '姓名',
  value: ''
}, {
  type: 'text',
  label: '年龄',
  value: ''
}, {
  type: 'checkbox',
  label: '兴趣爱好',
  data: ["上网", "旅游", "篮球", "跑步"],
  value: []
}, {
  type: 'radio',
  label: '性别',
  data: ["男", "女"],
  value: ''
}, {
  type: 'textarea',
  label: '备注1',
  value: ''
}, {
  type: 'textarea',
  label: '备注1',
  value: ''
}]
}

其中的value就是需要的数据，根据type的类型进行判断；要根据数据中的type来判断使用的类型
页面代码

<div id="app">
  <div class="ch