是否可以将动态对象键与 v-model 一起使用？

Question

这是我的数据结构：

form: {
   email: '',
   password: ''
}

现在我想使用循环并使用 form 对象动态设置模型。

<div class="my-1" v-for="(value,name, index) in form">
   <p class="capitalize"> {{ value }} </p>
   <!--<custom-input :value="value"></custom-input>-->
   <t-input v-model="dynamickmodel" class="w-full"/>
</div>

Answer 1

是的，通过使用对对象及其键的引用：

<t-input v-model="form[name]" class="w-full"/>

对 t-input 的更改应更新该键的值。

演示：

new Vue({
  el: "#app",
  data() {
    return {
      form: {
        email: '',
        password: ''
      }
    }
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
  <div class="my-1" v-for="(value, name, index) in form">
    <p class="capitalize"> {{ value }} </p>
    <input v-model="form[name]" class="w-full"/>
  </div>
</div>

是否可以将动态对象键与 v-model 一起使用？

Is it possible to use dynamic object key with v-model?

html

vue.js

vue-component

vuejs2

v-model