vue 更新数组的$set操作

170 阅读1分钟

因为 Vue.js 不能检测到下面数组变化。所以呢,想要正常是不能通过操作数组来渲染dom的,

解决的方法是通过set方法

template

...
<el-table :data="mapdataTable[0]">
	<el-table-column 
	....
<el-table :data="mapdataTable[1]">
	<el-table-column 
	....
<el-table :data="mapdataTable[2]">
	<el-table-column 
	....
...

script

...
data() {
	return {
   		mapdataTable: [[],[],[]],
        ...
    }
},
mounted() {
	getMapTableData(0);
    	getMapTableData(1);
    	getMapTableData(2); // 接口获取是三个table数据
}
methods: {
	getMapTableData(tabidx){
    	... 
        // 接口返回的数据 res
        this.$set(this.mapdataTable,tabidx,res)
        ....