vue js elementUI 实现表格默认选中,用promise改造普通请求
前端新手,不喜勿喷
需求:表格里面的数据要默认显示,如何将普通请求改为promise对象,等待所有请求结束,再对数据经行操作
表格默认显示:
table标签用ref标记 例如 ref=‘ref="curtainmultipleTable’
要回显数据用toggleRowSelection(row)
<el-table
class="table-class"
@selection-change="curtainSelectionChange"
:data="curtainTableData"
ref="curtainmultipleTable"
border
stripe
>
......
</el-table>
this.$refs.curtainmultipleTable.toggleRowSelection(item);
将普通请求改为promise
methods: {
async detailRowIdInfo() {
return new Promise((resolve, reject) => {
resolve(Api.ba.getWatchDialogData({ id: this.rowInfo.id }));
});
},
async getCurtainData() {
return new Promise((resolve, reject) => {
resolve(Api.ba.curtainsList({ areaId: this.getid }));
});
},
async getAirConditionerList() {
return new Promise((resolve, reject) => {
resolve(Api.ba.airConditionerList({ areaId: this.getid }));
});
},
}
mounted() {
Promise.all([
this.getLightDate(),
this.getAirConditionerList(),
this.getCurtainData(),
this.detailRowIdInfo()
]).then(res => {
console.log(res, "promise");
this.lightTableData = res[0].data;
this.airTableData = res[1].data;
this.curtainTableData = res[2].data;
this.detailData = res[3].data;
//想要重新渲染上去要用到this.$nextTick去获取更新后的DOM
this.$nextTick(() => {
this.curtainTableData.forEach(item => {
this.detailData.curtainses.forEach((value, key) => {
if (item.id == value.deviceId) {
this.$refs.curtainmultipleTable.toggleRowSelection(item);
}
});
});
});
});
},