VUEJS入坑日记.3--import ,export,export default

一、export和export default
export和export default都用于导出常量、函数、文件、模块等，区别是：
1、在一个JS文件中，export可以有多个；export default只能有一个；
2、它们的引用方式不同；
二、import用于引入一个JS文件：
1、如import引入的是依赖包，则不需要相对路径；
2、如import引入的是自定义的JS文件，则需要相对路径；
3、import使用export导出的需要用{}，使用export导出的不需要{}；

例子：

//d1.js
//d1.js是用export导出的
export const str = 'hello world'
export function f0(a){
	return a+1
}
export const f1 = (a,b) => {
	return a+b
}
export const f2 = (function () {
	return 'hello'
})()

引用方式：

//d2.js
//在d2.js中引用d1.js,d1.js是使用export导出的变量和函数，引用时要使用{}；
import { str,f0,f1,f2 } from 'd1' //名字要和export相同，d2.js和d1.js在同目录，如不同目录则 from '../../d1.js'，扩展名可以不写
const a = f1(1,2)
//也可以写成：
import {str} from 'd1'
import {f1} from 'd1'

//d3.js
//用export default导出，JS文件中只能有一个
export default const str = 'hello world'

引用：

//d4.js
//引用d3.js，使用export default导出的，引用时不要{}
import str from 'd3'  //名字可以任意

如在d3.js中要定义多个，可以先用export，然后再用export default批量导出，这样：

//修改后的d3.js
export const str = 'hello world'
export function f0(a){
	return a+1
}
export const f1 = (a,b) => {
	return a+b
}
export default {
   str,
   f0,
   f1
}

引用：

//修改d4.js
import d from 'd3'
const a = d.f0(45)