一、问题说明
Ant Design Vue 中使用 this.$confirm 时,this调用其他方法失败,提示是该方法未定义。
二、解决方法
在确认框中用到的当前作用域时,this需要提前替换为局部变量,否则浏览器会提示无法获取该属性。
onChange(e, record) {
//确认框中用到的当前作用域this需要提前替换为局部变量,否则浏览器会提示无法获取该属性。
let self = this
this.$confirm({
title: "确认修改此用户的状态信息?",
//自定义按钮内容
okText: "确认",
cancelText: "取消",
onOk() {
let values;
//根据开关状态初始化,传入后台的值
if(e){
values = {id:record.id,status:1}
record.status=1
}else{
values = {id:record.id,status:0}
record.status=0
}
//调用后台方法修改用户状态
axiosPostApi("/api/system/updateUserStatus", values).then((resp) => {
if (resp.code == 200) {
//重点内容:根据修改后的信息,调整前端数据集中的数据内容,这样就不用重新请求后台数据了。实现无刷新更新数据
self.$set(self.userData, self.userData.indexOf(record), record)
}
});
},
onCancel() {},
});
},