vue组件开发之用户无限添加自定义填写表单的方法

<template>  <div class="checkbox">    <div class="input">      <p v-for="item in inputs">        <span>自定义字段：</span>        <input type="text" v-model="item.val">      </p>      <button @click="addInput()">添加字段</button>      <button @click="sub()">保存提交</button>    </div>    <h1>提交的信息： {{submsg}}</h1>  </div></template><script>  export default {    name: 'checkbox',    data (){      return {        inputs:[],        submsg:''      }    },    methods: {      addInput (){        var obj = {};        obj.id = this.inputs.length;        obj.val = "";        this.inputs.push(obj);      },      sub (){        this.submsg = this.inputs;      },    }  }</script><style scoped>  *{margin:0 auto;padding:0;font-family:"微软雅黑";}  .checkbox{    width:800px;    margin:50px auto;  }  .input p{    padding:10px 0;  }</style>