Basic usage of export and import

Basic theory:

Export to an external output interface to this module

Import to load another module (containing or not containing export export) in one module

Note: export interface module does not contain a direct reference to: import "/assets/js/test.js"

Output variables

 

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

 

Note: import {a} in {} will be the same as the variable name of the variable name test.js

A plurality of variables // 
// the 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
},

}

Output function

 

//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)
},

 

Note the same as above

Output objects

//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 and export default difference

 

Reference herein https://www.cnblogs.com/xiaotanke/p/7448383.html