为什么我需要在ES6中用数字括号包装一些导入？

-2

我在ES6中发现了一个奇怪的情况。例如，我使用npm包react和react-router。我想将它们导入文件：为什么我需要在ES6中用数字括号包装一些导入？

import React from "react"; 
import { browserHistory } from "react-router";

奇怪的情况是，我需要在数字括号包裹browserHistory，但我并不需要包装反应。是什么原因？

import { React } from "react"; // React is undefined 
import browserHistory from "react-router"; // browserHistory is undefined

什么原因导致我需要自定义导入？

来源

2016-06-07 asiniy

[MDN - 导出]（https://developer.mozilla.org/en/docs/web/javascript/reference/statements/export）[MDN - 导入]（https://developer.mozilla.org/en/docs/web/javascript/reference/statements/import） – zerkms

疯狂猜测：有一个默认导出，React使用它。因此，在browserHistory中，您正在导出该方法，并且您正在获取具有不同名称的默认值，或者获取整个事件。 –

如果要导入的模块具有默认导出，则不必使用{}语法来访问给定的导出。命名（非默认）导出必须通过{}语法来访问。模块可以具有默认导出以及许多命名的导出。

一个例子是React，它是一个默认导出，但该模块也有一个命名的Component导出。要导入这两个导出，语法：import React, { Component } from 'react'将被使用。

来源

2016-06-07 06:27:15 httpNick

“如果您要导入的模块具有默认导出，则不需要{}语法”---这是模糊的。 '从'react'导入React，{Component};'是一个常用语句。无论默认导出是否存在，您可能需要也可能不需要使用命名导入。 – zerkms

谢谢@zerkms我编辑我的答案，希望解决我原来的答案有问题。如果我的观点不太好，请让我知道或进一步编辑。 – httpNick

“访问属性”---它不是“属性”，而是一个命名导出。 – zerkms

ES6模块区分两种出口：默认出口和其他出口。

每个模块最多可以有一个默认导出。默认导出有点像模块的“主要吸引力”。它应该是你可能意味着模块具有的一件事。所有其他出口都适合其他类别。

因此，一个模块可以有任何数量的导出（甚至为零），其中最多一个可以是默认导出。

// this is a normal export 
export var foo = 'foo'; 

// this is a default export 
var bar = 'bar'; 
export default bar;

在语法import side，这得到了更复杂的：默认出口

在语法的export side，默认的出口仅通过增加一个default的export关键字后标记进口外大括号。所有其他出口都在花括号内输入。

import bar, { foo } from 'some-module';

这将导入默认出口部件模块为bar，并导入（命名）等出口foo。请注意，默认导出没有固定名称：导出时成员的原始名称无关紧要。相反，你在导入时给它一些名字。所以你也可以这样写：

import baz, { foo } from 'some-module';

这仍然会导入与模块相同的默认导出，但会给它一个不同的名称。不过，其他进口商需要有正确的名称，因为这是用来识别它们的。但是，您可以使用as关键字给他们一个不同的名称。

使用export和import语句时还有几件事要知道。你应该检查MDN的完整描述。

来源

2016-06-07 06:42:31 poke

'default'是特殊的，因为它是一个关键字，但在它的核心，它只是一个名字，就像任何其他名字一样出口。不能导出两个名称相同的东西，不管名称是“default”还是别的东西。另请注意'export default bar;'不是导出默认值的唯一方法。您还可以执行'export {bar作为默认值};'，这还有额外的好处，您也可以实时绑定'bar'。 – loganfsmyth

为什么我需要在ES6中用数字括号包装一些导入？

回答

相关问题