import React 和 import { Component } 语法的区别 [英] Difference between import React and import { Component } syntax

问题描述

比如说，我们正在使用 React 和 ES6.我们将 React 和 Component 导入为

Say, we are using React with ES6. We import React and Component as

import React from 'react'
import { Component } from 'react'

为什么语法不同?我们不能按照下面的规定使用吗?

Why the syntax difference? Can't we use as specified below?

import Component from 'react'

推荐答案

这里是 docs 用于import.

import React from 'react'

以上是默认导入.默认导入使用 export default ... 导出.只能有一个默认导出.

The above is a default import. Default imports are exported with export default .... There can be only a single default export.

import { Component } from 'react'

但这是一个成员导入(命名导入).成员导入通过 export ... 导出.可以有很多成员导出.

But this is a member import (named import). Member imports are exported with export .... There can be many member exports.

您可以使用以下语法导入两者:

You can import both by using this syntax:

import React, { Component } from 'react';

在 JavaScript 中，默认导入和命名导入是分开的，因此您不能像默认导入那样导入命名导入.下面，将名称 Component 设置为 'react' 包的默认导出(这将与 React.Component 包不同)>:

In JavaScript the default and named imports are split, so you can't import a named import like it was the default. The following, sets the name Component to the default export of the 'react' package (which is not going to be the same as React.Component:

import Component from 'react';

这篇关于import React 和 import { Component } 语法的区别的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！