export default 与 export

说明

说明:set.js 与 get.js 同级目录
暴露也可以写在 .vue 文件的 script 标签中

Node

export default

写法1

set.js

export default {
    name: "大牛",
    age: 18
}

get.js

//这里的 diy 可以随便定义
import diy from './set.js'
console.log(diy );// {name: "大牛", age: 18}

写法2

set.js

var student = {
    name: "二蛋",
    age: 19
};
export default student

get.js

import test from './test.js'
console.log(test);// {name: "二蛋", age: 19}

export

暴露一个

set.js

export var student = {
    name: "三驴",
    age: 25
};

get.js

import {student} from './test.js'
console.log(student);// {name: "三驴", age: 25}

自定义名称接收

set.js

export var student = {
    name: "三驴",
    age: 25
};

get.js

import {student as tpf} from "./test.js";
console.log(tpf);// {name: "三驴", age: 25}

暴露多个

set.js

export var student = {
    name: "三驴",
    age: 25
};
export var student1 = {
    name: "三驴1",
    age: 251
};
export var stu_id=15;

get.js

import {student,student1,stu_id} from './test.js'
//等同于
// import {stu_id,student,student1} from './test.js'
console.log(student);// {name: "三驴", age: 25}
console.log(student1);// {name: "三驴1", age: 251}
console.log(stu_id);// 15

export default 和 export

set.js

export default {
    name: "大牛",
    age: 18
};

export var student = {
    name: "三驴",
    age: 25
};

export var student1 = {
    name: "三驴1",
    age: 251
};

export var stu_id=15;

get.js

// 这里 {} 中的值 需要和 export 暴露的值一直,不然不能接收会输出 undefined
import diy, {student, student1, stu_id} from './test.js'
//等同于,但是 diy不能放 大括号后面 {stu_id,student,student1},diy
// import diy, {stu_id, student, student1} from './test.js'
console.log(diy);// {name: "大牛", age: 18}
console.log(student);// {name: "三驴", age: 25}
console.log(student1);// {name: "三驴1", age: 251}
console.log(stu_id);// 15

总结

1. export default 只能暴露一个,接收名称可以自定义
2. export 需要写在 {} 中,也可以暴露多个,接收名称需要和暴露名称一致
3. export 如果需要自定义接收名称 可以使用 暴露名称 as 自定义名称