vue动态的表单，数据怎么绑定呢？

Question

表单是后台给过来的，个数不确定那input里的数据怎么绑定，表单怎么提交呢

<el-form :model="formInline" class="demo-form-inline">
    <li v-for="todo in todos">
       <el-input v-model="formInline.input" placeholder="请输入内容"></el-input>
    </li>
</el-form>

Answer 1

拿到数据后遍历数组做动态渲染，如果有不同类型的数据做判断，单独处理

Answer 2

<el-form :model="formInline" class="demo-form-inline">
    <li v-for="(todo,index) in todos" :key="index">
       <el-input v-model="todos[index]" placeholder="请输入内容"></el-input>
    </li>
</el-form>

Answer 3

<el-form :model="formInline" class="demo-form-inline">
    <li v-for="(todo, i) in todos">
       <my-el-input :value="todo.input" :formkey="i" @input="updateForm" placeholder="请输入内容"></my-el-input>
    </li>
</el-form>
...
methods: {
    updateForm(formkey, value) {
        this.todos[formkey].input = value;
    }
},

//my-el-input

<el-input v-model="currentValue" @input="inputEvent" placeholder="请输入内容"></el-input>
....
    props: ['value','formkey'],
    data() {
      return {
        currentValue: this.value
      }
    },
    methods: {
      inputEvent(value) {
        this.$emit('input',this.formkey, value);
      }
    },
      watch: {
        value (val) {
          this.currentValue = val;
        }
      }