1. 程式人生 > >ES6中export default 命令的詳解(引用)

ES6中export default 命令的詳解(引用)

我們知道在學習VUE的時候export default{}是不可缺少的,但是它的含義我們必須理解。 
export default{}這是在複用元件的時候用到的。假設我們寫了一個單頁面元件 A 檔案,而在另一個檔案 B 裡面需要用到它,那麼就要用 ES6 的 import/export 語法 ,在檔案 A 中定義輸出介面 export ,在檔案 B 中引入 import ,把引入的元件用起來,這樣就可以複用元件 A 去配合檔案 B 生成 html 頁面了。

 

//export-default.js 這是一個模組檔案export-default.js,

它的預設輸出是一個函式

export default function () { console.log('foo'); }

 

//import-default.js import customName from './export-default'; customName(); //'foo' //這是的import命令,可以用任意名稱指向export-default.js輸出的方法,這時就不需要知道原模組輸出的函式名。 需要注意的是,這時import命令後面,不使用大括號。

 

2、export default命令用在非匿名函式前

// export-default.js export default function foo() { console.log('foo'); } // 或者寫成 function foo() { console.log('foo'); } export default foo; //上面程式碼中,foo函式的函式名foo,在模組外部是無效的。載入的時候,視同匿名函式載入。