vue引用外部js
新建一个js文件,如我的export const list1 = [{ code: 'abc', id: 1 },{ code: 'def', id: 2 },];export const list2 = [];export const list3 = [];引用:import { list1 , list2,list3 } from '../common/module.js';注意imoprtt
·
一、引用:引用外部数据或者方法
1、先新建一个js文件,如我的
export const list1 = [
{ code: 'abc', id: 1 },
{ code: 'def', id: 2 },
];
export const list2 = [];
export const list3 = [];
export function getColumnsData(dateType) {
if (dateType=== 1) {
return [4,5,6];
} else {
return [1,2,3];
}
注意js文件中不能使用this.,如使用router
import router from '@/router';
export const userName = {
title: '用户名',
minWidth: 130,
// tooltip: true,
key: 'userName',
align: 'center',
customOrder: 6,
render: (h, params) => {
const abtn= h(
'a',
{
on: {
click: () => {
if (params.row.teacherOrStuFlag === 2) {
return;
}
let query = {
userId: params.row.id,
};
//
router.push({
name: 'userDetail',
query
});
}
}
},
params.row.userName
);
//绘制所有的操作控件
return h(
'div',
{
class: {
'text-overflow': true
}
},
[abtn]
);
}
};
2、引用:
import { list1 , list2,list3,getColumnsData } from '../common/module.js';
注意imoprtt引进的内容不可以用this去指向,可以在data中定义一个变量,把import内容赋值给本地对象,如我:
data(){
return{
list1:[],
list2:[],
list3:[]
}
}
created(){
this.list1 = list1;
this.list2 = list2;
this.list3 = list3;
this.columnsData = getColumnsData(1);
}
或者data中定义而不赋值:
import { eduSystemSelectData } from '@/utils/constant';
data{
return{
eduSystemSelectData
}
}
二、全局引用:如果一个js文件被频繁使用,不想每次在被引用文件中使用import 相对路径来单独引入,可以在main.js中使用Vue.user(arg)设置为全局引用。
如:
import VueQuillEditor from 'vue-quill-editor';
import 'quill/dist/quill.core.css';
import 'quill/dist/quill.snow.css';
import 'quill/dist/quill.bubble.css';
Vue.use(VueQuillEditor);
更多推荐
已为社区贡献15条内容
所有评论(0)