前端问题集(2):Ant Design Vue 中使用 this.$confirm 时,this调用其他方法失败。

一、问题说明

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() {},
      });
    },

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值