NuxtJS Access在nuxtjs注入方法中安装的vue插件

Question

我希望将VueToast包安装为插件，并使用nuxt添加全局帮助方法。如下图所示，我在5-11行之间安装插件。我需要访问第18行的$toast道具，但是我不能访问$toast道具。如何在注入方法中访问$toast道具？

Nuxt版本: 2.15.8 Vue版本: 2.6.14 Vue Toast通知版本: 0.6.2 Vue Toast Notification：https://github.com/ankurk91/vue-toast-notification/tree/v1.x

toast-plugin.js

import Vue from 'vue'
import VueToast from 'vue-toast-notification'
import 'vue-toast-notification/dist/theme-default.css'
    
Vue.use(VueToast, {
  position: 'top-right',
  duration: 3000,
  dismissible: true,
  queue: false,
  pauseOnHover: true
})

export default (context, inject) => {
  inject('showToast', {
    show ({
      message
    }) {
      context.app.$toast.open({
        message,
        type: 'error'
      })
    }
  })
}

nuxt.config.js

...
plugins: [
  '~/plugins/vee-validate',
  '~/plugins/toast-plugin.js',
  '~/plugins/loading-overlay-plugin.js',
  '~/plugins/axios-plugin.js',
  '~/plugins/http-client-plugin.js',
  '~/plugins/services.js',
  '~/plugins/snackbar-plugin.js'
  ],
...

Answer 1

我建议你安装@nuxtjs/土司。它使用引擎盖下面的烤面包。

您可以像这样访问已安装的插件

export default ({ app }, inject) => {
    console.log(app.store, app.yourInstalledPluginGlobalName)
}