Передать переменную в модуль vuejs - PullRequest
Новая
       8

Передать переменную в модуль vuejs

0 голосов
/ 12 октября 2018

Я использовал генератор событий из vue, чтобы заставить основное приложение общаться с компонентами, и оно работало, пока у меня было приложение и все компоненты в одном файле .js.

Но теперь яЯ хочу разделить их, по одному компоненту на файл, и, очевидно, я больше не могу использовать генератор событий, потому что app кажется неопределенным в модулях.

Что мне нужно изменить, чтобы иметь возможность иметь приложениеи компоненты снова общаются?

Мой код:

my-app.js 

import My from '/my-module.js';

const app = new Vue({
  router: new VueRouter({
    mode: 'history',
    routes: [{
      path: '/',
      component: My,
    }]),

  methods: {

    created(){
       this.ws = new WebSocket(...);
       this.ws.onmessage = event => {
         this.$emit('message', e);
       }
    }

  }

}).$mount('#app');

my-module.js 

export default {

  template: `....`

  created(){
    // I want to be able to access 'app' here
    // or another way to receive the messages
    console.log(app);
    app.$on('message', ...)

  }    

}

Как выЯ вижу, это нужно только потому, что я использую веб-сокеты, а приложение содержит клиент веб-сокетов.Компоненты должны что-то делать при получении определенных сообщений.

1 Ответ

0 голосов
/ 12 октября 2018

В вашем случае вы можете использовать эти события в нескольких компонентах, особенно когда приложение продолжает расти.Я думаю, вам лучше использовать eventbus до emit и catch все из них.

здесь, как использовать eventbus в vuejs: https://alligator.io/vuejs/global-event-bus/.

в вашем случае: 

import { eventBus } from 'path/to/file';

...

methods: {
    created(){
       this.ws = new WebSocket(...);
       this.ws.onmessage = event => {
         eventBus.$emit('message', e);
       }
    }
}

Другие компоненты: 

import { eventBus } from 'path/to/file';
...

created() {
  eventBus.$on('message',() => ) {
    // code
  }
}
...