Vue.js Dynamic use string

Question

I am trying to use vue-native-websocket and the wss is dynamic because it needs an access token.

So I have this:

import VueNativeSock from 'vue-native-websocket';
Vue.use(VueNativeSock, this.monitor);

export default {
  created() {
    this.$options.sockets.onmessage = this.handleToggle;
  },
  data() {
    return {
      type: false
    };
  },
 methods: {
    handleToggle(data) {
      const object = JSON.parse(data.data);
      console.log(object);
      this.status = object.data;
    }
  },
  props: ['items', 'monitor']
};

As you can see, the prop monitor is passed but when it comes time to do Vue.use()... I get undefined. How do I pass a dynamic variable to a Vue use?

This plugin doesn't handle dynamic websocket urls. There are a few issues about it open on github. If that is a requirement for you, suggest you find another library or roll your own. — Bert
– Bert, Commented Jun 2, 2018 at 1:58

Jacob Goh · Accepted Answer · 2018-06-02 01:48:04Z

1

Vue.use is for registering plugins globally.

I didn't use vue-native-websocket before. But

import VueNativeSock from 'vue-native-websocket';
Vue.use(VueNativeSock, ....);

should be done in the place where Vue is initiated (where new Vue({...}) is, it's in main.js in a typical vue-cli generated project.) . Not inside component.

Vue.use should also be executed before new Vue({...}) in main.js.

Therefore, I don't think you would be able to make wss dynamic, unless this plugin has a specified method for you do to that.

answered Jun 2, 2018 at 1:48

Jacob Goh

20.9k5 gold badges58 silver badges75 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Vue.js Dynamic use string

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related