写插件处理this传递的问题

Question

自己写了个vue的全局Toast插件，其中一个功能想做成在toast消失后提供一个api能传一个回调函数，类似于这样使用

this.$toast({
    callback(){
        this.$router.push('/')
    }
})

但是实现的时候this传不过去。
目前的方法是用了一个新的全局Vue实例通过$emit/$on来实现，但是感觉这样做会让toast插件与业务代码耦合，想问下如何解决这个问题

Answer 1

请使用箭头函数

this.$toast({
    callback: () => {
        this.$router.push('/');
    }
});

你之前的写法，this会被重新指向到window，就像使用function callback() {}一样，除非你用了bind()。
而箭头函数不一样，this总是指向用上一级的作用域

Answer 2

箭头函数试一下？

Answer 3

可以加一个入参，传入当前实例