vue中this在回调函数中的使用

Posted 2021-03-11 eternityz

this在各类回调中使用:

如果是普通函数是没法使用的

所以需要先将this.变量赋值给新的变量,然后才能在回调函数中使用

例如:
refund: function (id) {
      if (!this.url.refund) {
        this.$message.error("请设置url.refund属性!")
        return
      }
      var that = this;
      this.$confirm({
        title: "确认退款",
        content: "是否要进行退款?",
        onOk: function () {
          putAction(that.url.refund, { "id": id }).then((res) => {
            if (res.success) {
              that.$message.success(res.message);
              that.loadData();
            } else {
              that.$message.warning(res.message);
            }
          });
        }
      });
    },

如果是箭头函数式可以使用的

下面的这个例子只是参考,并不代表this.$confirm就是这么使用,具体参考ant的文档
下面的例子只是代表,箭头函数可以使用this
efund: function (id) {
      if (!this.url.refund) {
        this.$message.error("请设置url.refund属性!")
        return
      }
      this.$confirm({
        title: "确认退款",
        content: "是否要进行退款?",
        onOk: () => {
          putAction(that.url.refund, { "id": id }).then((res) => {
            if (res.success) {
              this.$message.success(res.message);
              this.loadData();
            } else {
              this.$message.warning(res.message);
            }
          });
        }
      });
    },