【Vue.js】---vue中单个js文件写法

1. vue export

介绍：

• export 语句用于从模块中导出函数、对象或原始值，以便其他程序可以通过 import 语句使用它们。
• 无论您是否声明，导出的模块都处于严格模式。 export语句不能用在嵌入式脚本中。

export 可以导出多个命名模块：

//demo1.js
export const string = 'hello world'
export function fun(a){
     return a+1
}

对应的引入方式：必须加大括号{}

 //demo2.js
  import { string, fun } from 'demo1'

2. vue export default

介绍：

1）只能导出一个默认模块，这个模块可以匿名：

//demo1.js
export default {
    a: 'hello',
    b: 'world'      
}

对应的引入方式：引入的时候可以给这个模块取任意名字，例如 "obj"，且不需要用大括号括起来。

//demo2.js
import obj from 'demo1'

2）也可以导出多个变量、方法、对象等，写法：

// demo1.js
const PLAN_TYPE_KEY_CODE = "produce_plan_type";
// 生产计划类型
const getPlanData = () => {
   // TODO
}
// 获取编码规则下拉列表
const getCodeData = () => {
    // TODO
}

export default {
    PLAN_TYPE_KEY_CODE ,
    getPlanData ,
    getCodeData ,
}

对应引入方式：

// demo2.js 
import BasicDataAction from "./demo1.js";

// 使用
created() {
        BasicDataAction.getPlanData();
        BasicDataAction.getCodeData();
    },

 3. 总结

export与export default均可用于导出常量、函数、文件、模块等，你可以在其它文件或模块中通过import+(常量 | 函数 | 文件 | 模块)名的方式，将其导入，以便能够对其进行使用，但在一个文件或模块中，export、import可以有多个，export default仅有一个

Tips: