Vue data属性对象赋值导致的v-for失效及表单无法输入问题

问题场景：模态框中的表单通过后端数据进行动态渲染（也就是动态生成表单项）
我是把数据放在下面这个触发表格的按钮点击弹出的Popover 弹出框中了 根据勾选相应的数据去循环生成如下的表单项

//注意这只是一个表单项
<el-form-item>
//...省略部分代码
<el-row :gutter="20">
	<!-- 这里的item是因为嵌套太多层 当作data里一个对象就好 -->
  <el-col
    v-for="(v, valueIndex) in item.value"
    :span="3"
  >
    <el-popover
        placement="top"
        width="400"
        trigger="click">
      <el-form
        :model="v"
      >
      <!-- 注意这里的skuPrice和skuStock 是后来添加进item.value中的 -->
        <el-form-item><el-input v-model="v.skuPrice" type="text" clearable placeholder="请输入商品价格"/></el-form-item>
        <el-form-item
        ><el-input v-model="v.skuStock" type="text" clearable placeholder="请输入商品库存"/></el-form-item>
      </el-form>
      //触发表格的按钮
      <el-button round size="mini" slot="reference">{{v.propertyValue}}</el-button>
    </el-popover>
  </el-col>
</el-row>
</el-form-item>

①v-for失效问题解决描述
②表单无法输入问题解决描述
都看下面这段代码

//使用vue elementui的应该比较了解
//这是表格的@selection-change事件 我一点击表格的多选框 就触发这个事件
selectionChange: function (selection){
      //清空value数组
      问题1：
      // 这里的row.value与上面的item.value引用一样 所以指向的是同一个对象
      //原来错误的清空方式
      this.row.value.length = 0;		//这样的问题和表单无法输入一样 是不会被vue检测到的 且vue不建议这么做
      //.............................................
      this.row.value = [];
      //通过中间变量row去改变当前操作行的value数组 达到自动添加html效果
      for (let i = 0; i < selection.length; i++){

      问题2：
       	//原来的错误写法..............................
       	this.$set(this.row.value, i, Object.assign(selection[i], {skuPrice: '', skuStock: ''}));
        //.........................................
        /*说一下上面错误的原因 这是因为这样赋值并不会被vue监测到 并不会生成相对应的get/set方法 致使表单输入失效*/
        this.$set(selection[i], 'skuPrice', '');		//这里是重点 新添加的属性 正确写法
        this.$set(selection[i], 'skuStock', '');		//这里是重点 新添加的属性 正确写法
        this.$set(this.row.value, i, selection[i]);
      }
}

总结：
操作数组/对象属性时：使用
this.$set/ this.$delete
还有一种办法是： this.$forceUpdate方法 暂时没用过 有兴趣的伙伴自行了解 这方法是强制更新dom用的