Question

创建React应用时，有个共同点：

import React, {Component} from 'react';

import语句。我很好奇为什么该行需要逗号？我尝试查找此内容，但找不到解释。

Answer 1

React是'react'的默认导出。

逗号后面是来自'react'的其他出口的列表。

如MDN docs中所述，导入语句的语法如下所示：

import defaultExport, { export [ , [...] ] } from "module-name";

Answer 2

Foo.js

export const bar = "bar";
export default "baz";

或：

export const bar = "bar";
const baz = "baz";
export default baz;

bar是命名导出，必须与{}一起导入。 baz是默认导出，可以使用任何名称导入而无需使用{}。

import baz, { bar } from "Foo";
console.log( baz, bar );

或

import bazButIwantFizz, { bar } from "Foo";
console.log( bazButIwantFizz, bar );

或

import bazButIwantFizz, { bar as barButIWantBuzz };
console.log( bazButIwantFizz, barButIWantBuzz );

因此，我们可以导入以逗号分隔的命名和默认导出。如注释中所建议，请参阅related documentation。

Answer 3

您必须在文件中使用JSX（html语法），该文件需要React作为导入依赖项，默认情况下是从“反应”模块中导出的。

然后，将Component导入为命名导入，用{}内的JS表示。如果需要，还可以执行其他操作，例如{Fragment，createElement}。

请参考MDN。

Answer 4

正如@Derek在上面的评论中所说。这是一种可能的导入语法。