快捷導(dǎo)航

VUE中的export default和export使用方法解析

更新時間：2022年12月14日 15:41:16 投稿：yin

export default和export都能導(dǎo)出一個模塊里面的常量，函數(shù)，文件，模塊等，在其它文件或模塊中通過import來導(dǎo)入常量，函數(shù)，文件或模塊。但是，在一個文件或模塊中export,import可以有多個，export default卻只能有一個。

export default和export的區(qū)別

export主要用于對外輸出本模塊變量的接口，一個文件就可以被理解為一個模塊。export就是導(dǎo)出。

import就是在一個模塊中加載另一個含有export接口的模塊， import就是導(dǎo)入。

export default和export都能導(dǎo)出一個模塊里面的常量，函數(shù)，文件，模塊等，在其它文件或模塊中通過import來導(dǎo)入常量，函數(shù)，文件或模塊。這樣就可以使用它們了。但是，在一個文件或模塊中，export,import可以有多個，export default卻只能有一個。

通過export方式導(dǎo)出，在導(dǎo)入的時候需要加{}大括號，export default 就不需要{}。

export default簡單示例

導(dǎo)出：

// test.js
var info = {
    name: 'zs',
    age: 20
}
export default info

接收：
代碼中的test.js為上面的代碼文件；aaa可以任意命名，可以在控制臺輸出info對象

import aaa, ?from './test.js'
console.log(aaa)

注意：

1、export default 向外暴露的成員，可以使用任意變量來接收

2、在一個模塊中，export default 只允許向外暴露一次

3、在一個模塊中，可以同時使用export default 和export 向外暴露成員

4、使用export向外暴露的成員，只能使用{ }的形式來接收，這種形式，叫做【按需導(dǎo)出】

5、export可以向外暴露多個成員，同時，如果某些成員，在import導(dǎo)入時，不需要，可以不在{ }中定義

6、使用export導(dǎo)出的成員，必須嚴格按照導(dǎo)出時候的名稱，來使用{ }按需接收

7、使用export導(dǎo)出的成員，如果想換個變量名稱接收，可以使用as來起別名

代碼示例

// test.js
var info = {
    name: 'zs',
    age: 20
}
export default info
 
export var title = '小星星'
 
export var content = '哈哈哈'

在下面代碼中接收，test.js使用export default 和 export 向外暴露的成員

import person, {title, content as content1} from './test.js'
console.log(person);
console.log(title + '=======' + content1);

到此這篇關(guān)于VUE中的export default和export使用方法解析的文章就介紹到這了,更多相關(guān)VUE中的export default內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

vue
export

欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

VUE中的export default和export使用方法解析

目錄

export default和export的區(qū)別

export default簡單示例

注意：

代碼示例

相關(guān)文章

最新評論

大家感興趣的內(nèi)容

最近更新的內(nèi)容

常用在線小工具