ES6 import语句中的花括号有什么用

Question

我可以看到有两种不同的导入方式import React from 'react'import { render } from 'react-dom'第二个有括号。那么两者之间有什么区别？什么时候应该加上括号？谢谢

Answer 1

考虑一下primitives.js，

export default (a, b) => a + b;

export const sub = (a, b) => a - b;

export const sqr = a => a**2;

可以这样导入

import sum, { sub, sqr } from './primitives';

在这种情况下，sum称为“默认导出”，并且一个模块只能包含一个“默认导出”。

sub并且sqr称为“命名导出”，并且一个模块可以包含多个命名导出。

Answer 2

花括号用于导入single(specific) property，而没有花括号的单词是import entire object该文件的形式。

例如。，

import React, { Component } from 'react';

这里的单词React代表entire object从文件导入'react'

{Component}表示我们指定particular property从文件导入。