Vue.js - プラグインのテスト

Question

私はvue.jsを学習しています。私はプラグインを持っている、それは次のようになります。

ソース/ myPlugin.js

const MyPlugin = { 
    install: function(Vue, options) { 
    console.log('installing my plugin'); 

    Vue.myMethod = function() { 
    }; 
    } 
} 

私は冗談を使用して、このプラグインをテストしようとしています。しかし、私はJestに落ち着いていません。私は冗談を経由して、このテストを実行すると、私がインストール「を参照してください期待していた

const Vue = require('vue/dist/vue'); 
const MyPlugin = require('../source/myPlugin'); 

Vue.use(MyPlugin); 

describe('MyPlugin',() => { 
    let vm; 

    beforeEach(() => { 
     const template = `<div id="app"></div>`; 
     vm = new Vue({ 
      template 
     }).$mount(); 
    }); 

    it('should run',() => { 
     Vue.myMethod(); 
     expect(true).toEqual(true);   
    }); 
}); 

テスト/ myPlugin.test.js：それでも、この時点で、私は私のtest/myPlugin.test.jsファイルに次の持っています私のプラグイン "をコンソールウィンドウに表示します。しかし、私はしません。代わりに、私は参照してください：

TypeError: Vue.myMethod is not a function 

私は間違って何をしていますか？いくつかのテストで基本的なプラグインをセットアップしようとしています。なぜこれが動作していないのか分かりません。どんな助けもありがとうございます。

Answer 1

通常、この方法でVueオブジェクトにメソッドをアタッチしません。ほとんどの場合、prototypeに追加します。

Vue.prototype.myMethod = function() {}; 

次に、あなたは

vm.myMethod() 

console.clear() 
 

 
const MyPlugin = { 
 
    install: function(Vue, options) { 
 
    console.log('installing my plugin'); 
 

 
    Vue.prototype.myMethod = function() { 
 
     console.log("method called") 
 
    }; 
 
    } 
 
} 
 
Vue.use(MyPlugin); 
 

 
const template = `<div id="app"></div>`; 
 
vm = new Vue({ 
 
    template 
 
}).$mount(); 
 

 
vm.myMethod();

<script src="https://unpkg.com/vue@2.2.6/dist/vue.js"></script>