如何在 javascript/es6 中导入两个同名的类？答案

【问题标题】：How to import two classes by the same name in javascript/es6?如何在 javascript/es6 中导入两个同名的类？
【发布时间】：2016-04-15 08:57:18
【问题描述】：

我在文件中有这两个导入语句：

import Data from 'component/Data.js';
import Data from 'actions/Data.js';

两个文件都包含一个名为Data 的类。

如何指定哪个是哪个？如何避免名称冲突？

【问题讨论】：

【解决方案1】：

大概component/Data 和actions/Data 都有默认导出而不是命名导出？像这样：

export default class Data {}

如果是这样，那么 importer 可以随意调用变量：

import Data1 from 'component/Data.js';
import Data2 from 'actions/Data.js';

如果它们被命名为导出：

export class Data {}

然后你需要使用大括号和as 来指定源和目标名称：

import { Data as Data1 } from 'component/Data.js';
import { Data as Data2 } from 'actions/Data.js';

【讨论】：

正是我想要的，我尝试了import { Data } as Data2 from 'actions/Data.js';，但没有成功，来到这里并意识到我的错误。
请注意，您必须对两者都使用别名，仅使用别名是行不通的。我不知道为什么。

【解决方案2】：

已编辑：根据 RGraham 的回答，更新我的回答：

你不能这样导入吗：

import {Data as D1} from 'component/Data.js';
import {Data as D2} from 'actions/Data.js';

然后根据需要使用它：

D1.{}
D2.{}

【讨论】：

【解决方案3】：

有两种选择：

import {MyClass as c1} from ......
import {MyClass as c2} from ......

或第二种选择：

import MyClass from .......
import {MyClass as c2} from ......

您可以使用第一行，但在某些情况下，使用第一行可能会卡住。然后使用第二行。

【讨论】：