Vueグローバルマウントカスタム関数のいくつかの方法

前提:
多くの関数が繰り返し使用されているので、これらの関数をグローバルにマウントすることができ、時間と労力を節約することができます.
実装:
1、方法一:Vue.prototype

main.js加入

//Vue          
//folding       
//internalFolding     

Vue.prototype.internalFolding = function (folding){
    //    
}

すべてのコンポーネントで関数

を呼び出すことができます.

this.internalFolding(folding)

ここでの参照方式は、すべての参照がmainに格納されるため、使用を推奨しない.jsでめちゃくちゃに見えます! 
2、方法2:exports.install+Vue.prototype

自分の必要な公共JSファイル(folding.js)

を書く

  exports.install = function (Vue, options) {
    Vue.prototype.internalFolding = function (folding){
        if(folding){
            $(".abnormal-center-right").css("left","1%");
            $(".abnormal-center-right").css("width","98%");
            $(".all-page-flexible").css("left","0");
            }else{
             $(".abnormal-center-right").css("left","21%"); 
            $(".abnormal-center-right").css("width","78%");
            $(".all-page-flexible").css("left","20%");
            }
    };
};  

main.jsは

を導入し、使用する

import folding from '../static/js/folding'
Vue.use(folding);

 

すべてのコンポーネントで呼び出すことができる関数

this.internalFolding(this.folding) 

ここの引用方法はお勧めです!