VUE 中封装公共js 全局化定义变量 调用公共方法

1.首先，在assets中建立公共js => config.js

2.在config.js 中 封装全局定义变量 和 公共方法

const dev = {
     dataType:[
         {dataName:'图片',dataId:'1'},
         {dataName:'视频',dataId:'2'},
         {dataName:'语音',dataId:'3'},
         {dataName:'文本',dataId:'4'},
     ],
     getDataType(dataType){
         if (dataType === 1) {
             return "图片";
         } else if (dataType === 2) {
             return "视频";
         } else if (dataType === 3) {
             return "语音";
         } else if (dataType === 4) {
             return "文本";
         }
     }
}
export default  dev;

3.在main.js 中导入 config.js 公共js

import dev from '@assets/config.js'
Vue.prototype.$dev = dev

4.调用封装好的全局数组

<el-checkbox-group v-model="dataTypeList">
   <el-checkbox v-for="(item,index) in dataTypeText" :label="item.dataId" :key="index">{{item.dataName}}</el-checkbox>
</el-checkbox-group>

5.调用封装好的公共方法

  {{ $dev.getDataType(scope.row.dataType) }}

 

 

 

感谢阅读，欢迎订阅！个人学习笔记，大家一起分享学习，共同进步！