vue开发自己的插件引入问题

Question

1.这是我写的插件

var MyPlugin = {}
MyPlugin.install = function (Vue, options) {
  var utils = {
    get: function (url, parms) {
      Vue.$http.jsonp(url)
    }
  };
  Vue.prototype.myUtils = utils
}
module.exports = MyPlugin

2.这是main.js中的引入顺序

import Vue from 'vue'
import App from './App'
import router from './router'
import VueResource from 'vue-resource'
import myPlugin from '../static/utils.js'
Vue.config.productionTip = false
Vue.use(VueResource)
Vue.use(myPlugin)
/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  template: '<App/>',
  components: { App },
  data: {
    eventHub: new Vue()
  }
})

3.调用时候的代码

methods: {
        postmsg () {
          this.myUtils.get('http://localhost:3000/showstep')
              .then(response => {
                console.log(typeof response.data)
                this.newmsg = response.data[0].stepname
              })
          this.$root.eventHub.$emit('add', '111')
        }
      }

4.浏览器报错如下:

我的插件是在vue-resource和Vue之后引入的啊,为什么还是找不到Vue这个实例呢?

Answer 1

插件写的方式不对, install方法里面没有mixin注入组件, 使用的时候找不实例可能是这个原因

这个官方文档上写的, mixin注入组件
这篇老外写的博客也很简单易懂, 不用翻墙可以访问, 可以参照着来