el-table中的el-input-number标签修改值变了但界面没变

又遇到了数据修改了页面却没有立即刷新的问题，本以为是很简单的问题，却借用了三五位老师的文章才解决。下面五种方法提供给大家，这个不行就用下一个！

1、一开始自信地以为加一个this.$forceUpdate()就能够解决问题：

row.secDeliveryQuantity=formula*row.mainDeliveryQuantity
this.$forceUpdate()

2、然后想到vue2要使用$set去深度修改该数组下的这一项：

this.$set(this.tableList[index],'secDeliveryQuantity',formula*row.mainDeliveryQuantity);

3、然而依然没有生效，这时我才意识到，这次可能不是一个简单的问题，于是我又搜了一下，要用$set直接修改数组，直接修改某一项是无法监听到的：

(参考：element-UI el-table修改input值视图不更新问题_vue.js_脚本之家)

this.$set(this.tableList, index, row);

4、还是不可以，于是我又搜到了另一种方法this.$nextTick和setTimeout来回测试：

(参考：解决el-input-number修改值后不更新_el-input-number change-优快云博客 )

this.$nextTick(()=>{
	row.secDeliveryQuantity=formula*row.mainDeliveryQuantity
	this.$set(this.tableList, index, row);
	setTimeout(() => {
		row.secDeliveryQuantity=formula*row.mainDeliveryQuantity
		this.$set(this.tableList, index, row);
     }, 0);
})

5、不行，最后终于找到了我的专属办法，就使用一个小妙招强制组件更新：

(参考：el-table中的el-input标签修改值，但界面未更新，解决方法_vxe-input 重置了值但页面没有改变-优快云博客 )

row.secDeliveryQuantity=formula*row.mainDeliveryQuantity
this.key++

<el-input-number
	v-model="scope.row.secDeliveryQuantity"
	:index="key"
    disabled
/>

遇到问题一定要多尝试，别人可以的可能你不可以，别人不可以的可能就适用于你。