es6中import跟export遇到了问题

Question

// request.js
...
export default {
    get(){},
    post(){}
}; 

// api.js
import { get, post } from './request.js'
...

请问各位大神，这样写为什么在api.js中找不到get和post呢,换成下面这样就可以了，什么原因呢？

// api.js
import request from './request.js'
const { get, post } = request
...

Answer 1

因为你导出的只有一个 Object，咋能解构成两个呢？

你要是想导出俩，就不要用 default 了，改成：

// request.js
export const get = () => { };
export const post = () => { };

然后你就可以 import { get, post } from './request.js' 了。

---

进阶：

可以 default 做个兜底：

// request.js
export const get = () => { };
export const post = () => { };

export default {
    get,
    post
};

// 既可以
import { get, post } from './request.js';
get();

// 也可以
import request from './request.js'
request.get();

Answer 2

你是不是混淆了export和export default
export和export default区别

如果想直接import { get, post } from './request.js'获取get和post方法
应该在request.js中 export {get, post}
又或者第二种方法使用request.get获取get方法

Answer 3

首先，使用export default必须记住一句话
export default命令用于指定模块的默认输出。显然，一个模块只能有一个默认输出，所以，import命令后面才不用加大括号。

// request.js
function get(){};
function set(){};

export default {
    get,set
}; 

// api.js
import api from './request.js'  // api 这个对象拥有get,set方法

希望能够帮助到你！