小编Inf*_*cto的帖子

如何将 Vuetify 注入我的自定义 vue 插件

我想创建一个带有以编程方式呈现 Vue 组件的函数的 Vue 插件。该组件依赖于 Vuetify。如果我在该组件中使用 vanilla HTML/CSS,一切正常,但在那里使用与 Vuetify 相关的东西(例如 a )不起作用。我假设我没有正确地将 vuetify 自身注入到组件中。

在我的自定义组件中,我尝试分别导入每个 Vuetify 组件,但没有成功。我还尝试使用以下语法创建组件:new Vue({vuetify}),但也没有成功。

import MyCustomComponent from '@/components/MyCustomComponent'
import vuetify from '@/plugins/vuetify';



export default {
  install(Vue, options) {
    function renderMyCustomComponent() {
        const CustomComponent= Vue.extend(MyCustomComponent)
        Vue.use(vuetify)
        let instance = new CustomComponent()
        instance.$mount()
        document.body.appendChild(instance.$el)
    }

    Vue.prototype.$renderMyComponent = renderMyCustomComponent
  }

}
Run Code Online (Sandbox Code Playgroud)

错误消息表明,我的组件中没有 vuetify(或至少它的一些属性) [Vue warn]: Error in getter for watcher "isDark": "TypeError: Cannot read property 'dark' of undefined"

提示/编辑:我正在使用 Vuetify 2.0。Vuetify 注入应用程序的方式发生了一些变化。这是我的 vuetify 插件文件的代码:

import Vue from 'vue'; …
Run Code Online (Sandbox Code Playgroud)

plugins vue.js vuetify.js

3
推荐指数
1
解决办法
2164
查看次数

标签 统计

plugins ×1

vue.js ×1

vuetify.js ×1