Javascript Vue-使用插件作为原型

我在应用程序中使用的通知。每次我想通知用户时，我都需要编写以下代码：

如果在Vue组件内：

this.$notify({
    group: 'panel',
    type: 'success',
    duration: 5000,
    text: 'message'
})

或者如果在.js文件中：

Vue.notify({
    group: 'panel',
    type: 'success',
    duration: 5000,
    text: `message`
})

我想创建一个支持文件，类似于，只需调用以下行即可编写通知：

this.$notify('message')

这是我一直尝试到现在，但没有成功

main.js

import Vue from 'vue'
import App from './App.vue'
import notifications from './support/notifications'

Vue.use(notifications)

new Vue({
  render: h => h(App)
}).$mount('#app')

import Vue from 'vue'
import Notifications from 'vue-notification'

Vue.use(Notifications)

export default function install(Vue) {
    Object.defineProperty(Vue.prototype, '$notify', {
        get(message) {
            return Vue.notify({
                group: 'panel',
                type: 'success',
                duration: 5000,
                text: message
            })
        }
    })
}

notifications.js

import Vue from 'vue'
import App from './App.vue'
import notifications from './support/notifications'

Vue.use(notifications)

new Vue({
  render: h => h(App)
}).$mount('#app')

import Vue from 'vue'
import Notifications from 'vue-notification'

Vue.use(Notifications)

export default function install(Vue) {
    Object.defineProperty(Vue.prototype, '$notify', {
        get(message) {
            return Vue.notify({
                group: 'panel',
                type: 'success',
                duration: 5000,
                text: message
            })
        }
    })
}

---

我认为除了使用

Object.defineProperty

之外，您几乎实现了您想要的功能。 尝试返回

函数

引用，而不是

Vue。在
get
方法上通知

的返回

import Vue from 'vue'
import Notifications from 'vue-notification'

Vue.use(Notifications)

export default function install(Vue) {
    Object.defineProperty(Vue, 'notification', {
        get() {
            return notification;
        }
    })

    Object.defineProperty(Vue.prototype, '$notification', {
        get() {
            return notification;
        }
    })
}

function notification(message) {
    Vue.notify({
        group: 'panel',
        type: 'success',
        duration: 5000,
        text: message
    })
}

---

我认为除了使用

Object.defineProperty

之外，您几乎实现了您想要的功能。 尝试返回

函数

引用，而不是

Vue。在
get
方法上通知

的返回

import Vue from 'vue'
import Notifications from 'vue-notification'

Vue.use(Notifications)

export default function install(Vue) {
    Object.defineProperty(Vue, 'notification', {
        get() {
            return notification;
        }
    })

    Object.defineProperty(Vue.prototype, '$notification', {
        get() {
            return notification;
        }
    })
}

function notification(message) {
    Vue.notify({
        group: 'panel',
        type: 'success',
        duration: 5000,
        text: message
    })
}

---

我们可以把问题简单化。我们的目标是在巴西建立一个联盟，。huehueuheThere只是一个问题，当我调用时，在.js文件中：

Vue.notify（'message'，'error'）

什么都没有发生可能是因为循环调用导致了

最大调用堆栈大小超过了。我将自定义插件更改为“$notification”，以避免名称冲突。你能测试一下吗？成功了。。。生命中还有一件事，不要使用与插件相同的名称…E quem diria que uma simples funão causaria esse problema hehePoisé。我们的目标是在巴西建立一个联盟，。huehueuheThere只是一个问题，当我调用时，在.js文件中：
Vue.notify（'message'，'error'）
什么都没有发生可能是因为循环调用导致了
最大调用堆栈大小超过了。我将自定义插件更改为“$notification”，以避免名称冲突。你能测试一下吗？成功了。。。生命中还有一件事，不要使用与插件相同的名称。。。