解构扩展导入 ES6

Posted 2023-02-22

【中文标题】解构扩展导入 ES6

【英文标题】：Destructure Spread off Import ES6

【发布时间】：2016-06-22 02:24:25

【问题描述】：

import Component, ...actions from '../MyModule';

似乎抛出了一个 linting 错误。为什么不能在 ES6 导入语句上“传播”？

【问题讨论】：

你期望解构做什么？给你所有其他导出减去Component？

查看规范：ecma-international.org/ecma-262/6.0/#sec-imports NamedImports 的表示法可能看起来像对象表示法，但它有些不同（这就是为什么没有解构的原因）。如果 MyModule 导出一个对象，您可以在赋值中进行解构。

主要是因为扩展运算符不是 ES6 的一部分，而是对某些未来版本的提议。

【参考方案1】：

ES6 的导入语法不是解构的，就这么简单。语法以开头，但其格式完全不同，在实现中的处理方式也大相径庭。例如，您可以使用

重命名导入

 import Component as MyComponent from './MyModule';

这显然不是对象字面量。

如果您需要一个可用于将导入作为属性引用的对象，您可以这样做

 import * as MyModule from '../MyModule';

然后使用MyModule.<exportName>。如果您的目标是专门获取一个包含所有导出值的对象，不包括Component，那么您总是可以在之后进行解构，例如

 const Component, ...actions = MyModule;