在写前端vue时,用el-table显示申请记录表,先从后端拿到一条申请的申请人id,再遍历tableData,根据申请人id获取姓名,但界面一开始不显示申请人姓名,但当我点击F12开发者模式后,界面又能够显示姓名了,一下是一部分代码
async getData() {
await axios.get("http://localhost:10100/Apply/getAllOutApplyPageOfGroup", {
params: {
approvalId: localStorage.getItem("userId"),
pn: this.currentPage,
ps: this.pageSize
}
}).then(res => {
this.tableData = res.data.data.records
this.total=res.data.data.total
})
for (var i in this.tableData) {
await axios.get("http://localhost:10100/User/getUserName", {
params: {
userId: this.tableData[i].applicantId
}
}).then(res => {
this.tableData[i].applicantName = res.data.data
})
await axios.get("http://localhost:10100/Chemicals/getChemicalName", {
params: {
chemicalId: this.tableData[i].chemicalId
}
}).then(res => {
this.tableData[i].chemicalName = res.data.data
})
await axios.get("http://localhost:10100/Chemicals/getUnit", {
params: {
chemicalId: this.tableData[i].chemicalId
}
}).then(res => {
this.tableData[i].unit = res.data.data
})
if (this.tableData[i].isPass === "0") {
this.tableData[i].passName = "审核中"
} else if (this.tableData[i].isPass === "1") {
this.tableData[i].passName = "拒绝"
} else if (this.tableData[i].isPass === "2") {
this.tableData[i].passName = "同意"
}
}
},
界面mounted时调用此函数
出错时:
我想让这些字段一开始就能够显示