如何在 ES6 模块中导入部分对象答案

【问题标题】：How to import part of object in ES6 modules如何在 ES6 模块中导入部分对象
【发布时间】：2015-07-19 05:59:53
【问题描述】：

在react documentation我找到了这种方式导入PureRenderMixin

var PureRenderMixin = require('react/addons').addons.PureRenderMixin;

如何以 ES6 风格重写。我唯一能做的就是：

import addons from "react/addons";
let PureRenderMixin = addons.addons.PureRenderMixin;

希望有更好的办法。

【问题讨论】：

也许import {addons:{PureRenderMixin}} from 'react/addons'
@elclanrs no（至少它不适用于 babel）
这与Passing options to ES6 module imports 非常相似——目前还不可能。
ES6 - Convert from 'require' to 'import'的可能重复

标签： javascript module browserify ecmascript-6 commonjs

【解决方案1】：

很遗憾，import statements 不像 object destructuring 那样工作。此处的大括号表示您要导入具有此名称的令牌，而不是默认导出的属性。看看这对导入/导出：

 //module.js
 export default 'A';
 export var B = 'B';

 //script.js
 import A from './a.js';  //import value on default export
 import {B} from './a.js'; // import value by its name
 console.log(A, B); // 'A', 'B'

对于您的情况，您可以导入整个对象并进行解构赋值

 import addons from "react/addons";
 let {addons: {PureRenderMixin}} = addons;

【讨论】：

import {addons} from 'react/addons'; const {PureRenderMixin} = addons; 也可以。也看看github.com/gaearon/react-pure-render#mixin

【解决方案2】：

import PureRenderMixin from 'react-addons-pure-render-mixin';

参见示例here。

【讨论】：