vue通过接口判断list中的按钮是否展示

html

<el-table-column label="操作">

<template slot-scope="scope">

<el-button v-if="scope.row.isAllowed" type="text" @click="examination_registerFn(scope.row.serverId

)">重新报名</el-button>

</template>

</el-table-column>

方法

// 是否显示重新报名的接口查询

examination_checks() {

let arr = []

// console.log(this.list);

this.list.forEach(v => {

arr.push(v.serverId

)

})

this.examIds.ids = arr

// console.log(arr);

examination_check(this.examIds).then((res) => {

res.data.forEach(v => {

this.list.forEach(val => {

//当接口查回来的id等于列表中当前行的serverId时，把查回来的是否显示按钮的值赋给原列表行的数据

if (v.id == val.serverId) {

val.isAllowed = v.isAllowed

}

})

})

}).catch(err => {

this.$message.error(err.msg)

})

},

//在list中调用是否显示这个按钮的接口

getList(page) {

this.parmes.pageIndex = page ? page.curr : 1

this.parmes.pageSize = page ? page.limit : 10

if (this.activeName == 'first') {

applicationPage(this.parmes).then(resp => {

if (resp.code == 200) {

this.list = resp.data.items

this.total = resp.data.total

this.examination_checks()

}

})

} else if (this.activeName == 'second') {

studyResultHour(this.parmes).then(resp => {

if (resp.code == 200) {

this.list = resp.data.items

this.total = resp.data.total

}

})

}

}