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

Question

我在文件中有这两个import语句:

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

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

我该如何指定哪个是哪个？我该如何避免姓名冲突？

Answer 1

据推测component/Data,actions/Data两者都有默认出口而不是命名出口？像这样:

export default class Data {}

如果是这种情况,那么导入器可以随意调用变量:

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

如果它们被命名为exports:

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';` 没有用，来到这里并意识到我的错误。 (3认同)

Answer 2

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

你不能像这样导入它：

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

然后根据需要使用它：

D1.{}
D2.{}