export和import的基本用法

基本理论:

export用于对外输出本模块的接口

Import用于在一个模块中加载另外一个模块(含有export或者不含有export)

注:不含有export接口的模块直接引用  :import "/assets/js/test.js"

输出变量

//test.js
 export var a=2;
//index.vue
import {a} from '../assets/js/test.js';
mounted() {
    console.log(a)
},

注意:import {a} 中的{}里面的变量名应与test.js中的变量名相同

//多个变量
//
test.js var a=2; var b=3; export {a,b} //index.vue import {a,b} from '../assets/js/test.js';
export default{

mounted() {
    console.log(a+b) //5
},

}
 

输出函数

//test.js
export async function test1() {
    await test2();
    console.log('test1')
}
function test2(){
    console.log('test2')
}
//index.vue
import {test1} from '../assets/js/test.js';
mounted() {
    test1()
    console.log(test1)
},

注意事项与上面相同

输出对象

//test.js
export default {
    async test1()  {
        await this.test2();
        console.log('test1')
    },
     test2(){
        console.log('test2')
    }
}
//index.js
import test1 from '../assets/js/test.js';
export default {
mounted() {
    console.log(test1)
     test.test1();//test1 test1.test2();
//test2
}, }

export和export default区别

本文参考https://www.cnblogs.com/xiaotanke/p/7448383.html

原文地址:https://www.cnblogs.com/peilin-liang/p/11947653.html