export import的使用方法

export 和 export default

在html中引入需要使用import的js文件时，需要添加type:“module”。

<script src="js/index.js" type="module" charset="utf-8"></script>

 

export在一个文件里可以有多个，export default只能有一个。

且export传输的参数需要知道变量名，在引入时需要正确写入变量名。如：

//util.js中
const data = `你好`
export {data}

//index.js中接收
import {data} from './util.js'
console.log(data)

而export default传递的参数则不需要知道变量名。如：

//util.js中
const data = `你好`
export default{data}

//index.js中接收
import getData from './util.js'  　　//会默认接收export default中的参数
console.log(getData) //输出你好

万能引入方法，会把所有参数都引入。

//util.js中
const data = `你好`
const res = '传输成功'
export default{data}
export {res}


//会接收所有数据并传进Data中
import * as Data from './util.js'
console.log(Data) //输出object{data:"你好",res:"传输成功"}