Как получить доступ к данным из плагина, подключённого к Vue?

Question

[Ankozar]

Не понимаю, как это реализуется. Вроде курил мануал, но не доходит.

main.js:

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import plan from './myPlugin.js'

createApp(App).use(store).use(router).use(plan).mount('#app')

myPlugin.js:

class Plan {
...
}

export default {
    install: function () {
        let viewedPlan = new Plan ()
        console.log(viewedPlan)
    } 
}

В итоге вот эта строчка

createApp(App).use(store).use(router).use(plan).mount('#app')

вызывает срабатывание
console.log(viewedPlan)

И всё.

Больше никак получить доступ к этой функции в шаблонах Vue я не могу...
например, вские способы типа

...
mounted(){
    console.log(this.$plan)
    console.log(this.plan)
  }
...

и т.д. выдают undefined

С другой стороны, получается прикрутить что угодно через

//myPlugin.js
export default ({
    install: function () {
      Object.defineProperty(Object, '$plan', {value: plan})
    }  
})

//main.js
...
import plan from './myPlugin.js'
createApp(App).use(store).use(router).use(plan).mount('#app')

Тогда в любом месте приложения я могу обратиться к Object.$plan() и оно работает. Но это неправильно. Или только так и надо?

Answer 1

[Сергей delphinpro]

install– это зарезервированное имя метода для подключения плагина.
Когда вы используете метод .use(my_plugin) вызывается метод install() вашего плагина.
Там вы можете делать что угодно. В том числе обеспечивать доступность через какое-то глобальное свойство у объекта Vue

Comments

[Ankozar]

Спасибо.

Можете пример кода привести?
И как получить доступ к объекту Vue?
Почему-то import Vue from 'vue' не работает.

upd:
Сделал вот так:

var viewedPlan = new Plan ()
import App from './App.vue'

export default {
    install: function () {
        App.viewedPlan = viewedPlan
    } 
}

Дальше во всём приложении доступ к AppVue.viewedPlan есть.
Так правильно?

upd:
А, нет, не во всём... запутался.