使用set方法解决创建动态元素时的双向绑定问题

介绍及背景

关于动态创建元素时，无法使用v-model进行数据双向绑定的问题

在使用vue做前端时，有时，需要动态生在表单元素，且需要使用v-model指令，动态绑定变量。

但是，是我们知道，vue双向绑定变量的功能，仅在提前声明为date(){return {}}时，方可在模板中，使用动态绑定，否则，无法正确绑定。

解决办法

Vue.set( object, key, value )
// 在vue模块中，使用全局变量 this.$set()方法

正解如下：

<template>
  <div>
    <p v-for="(item,key) in inputArray" >
            <input v-model="item.name" >
    </p>
    
  </div>
</template>

<script>
const testObjs = {
  realName: '管理员',
  account: 'admin',
  age: 5
}
export default {
  data(){
    inputArray: {}
  },
  methods:{
  	addArray:function(){
      for(const key in testObjs}
      	this.$set(this.inputArray, key, testObjs[key])
      }
    }
 }
}
</script>