什么情况下使用export default ,什么情况下使用export
时间: 2023-05-29 21:03:17 浏览: 36
1. 当一个模块只需要导出一个值或者一个对象时,可以使用export default。例如:
```
// moduleA.js
const a = 1;
export default a;
// moduleB.js
import a from './moduleA.js';
console.log(a); // 1
```
2. 当一个模块需要导出多个值或者对象时,可以使用export。例如:
```
// moduleC.js
export const b = 2;
export const c = 3;
// moduleD.js
import { b, c } from './moduleC.js';
console.log(b, c); // 2, 3
```
总的来说,export default 适合用于导出一个值或者对象,而 export 适合用于导出多个值或者对象。但是,使用哪种方式还是要根据具体的情况而定。
相关问题
使不使用export default useLayOutSettingStore有什么区别
在 Vue 3 中,使用 `export default` 与使用命名导出有一些区别。
如果使用 `export default`,则在导入该模块时,可以自定义该模块的名称。例如:
```js
// layoutSettingStore.js
import { createStore } from 'vuex'
const useLayOutSettingStore = createStore({
// ...
})
export default useLayOutSettingStore
```
```js
// other.js
import myStore from './layoutSettingStore'
console.log(myStore) // useLayOutSettingStore 中的内容
```
而如果使用命名导出,则必须使用相同的名称进行导入。例如:
```js
// layoutSettingStore.js
import { createStore } from 'vuex'
export const useLayOutSettingStore = createStore({
// ...
})
```
```js
// other.js
import { useLayOutSettingStore } from './layoutSettingStore'
console.log(useLayOutSettingStore) // useLayOutSettingStore 中的内容
```
在使用 `export default` 时,导入模块时可以自定义名称,这在代码阅读时可能会更加方便,但是也会增加代码的复杂度。而使用命名导出则可以明确每个导出的名称,更加清晰,但是在导入时需要使用相同的名称,不能自定义。
有export default 还可以使用export 吗
可以的,使用export default和使用export的区别在于,export default是默认导出一个模块,而export则是导出模块中指定的变量、常量、函数等。在同一个模块中,可以使用多个export语句导出多个变量、常量、函数等。举个例子,假设有一个模块文件module.js:
```
export default {
name: 'module',
version: '1.0.0'
}
export const foo = 'foo'
export function bar() {
console.log('bar')
}
```
在其他文件中导入该模块时,可以使用以下方式:
```
import module from './module.js' // 导入默认导出的模块
import { foo, bar } from './module.js' // 导入指定的变量、函数等
```
如果要使用默认导出的模块和其他导出的变量、函数等,可以这样写:
```
import module, { foo, bar } from './module.js'
```