가져 오기 반작용 대 반작용, {구성}</p> <p>하나가 더 나은 이유 <code>Import React, { Component }</code> 대

Question

Import React?

나중에 코드를 적게 쓰는 것 외에 다른 점이 있습니까?

{ Component }을 쓰는 것은 Component 객체 만 가져 오기만한다는 것을 의미합니까?

Answer 1

import React, { Component } 대신 class Menu extends Component을 사용할 수 있습니다. React 네임 스페이스는 일반적으로 원하는 현대 코딩 규칙 인 타이핑 및 복제가 적습니다.

또한 Webpack 2 및 Rollup과 같은 도구는 사용하지 않은 내보내기가 최종 코드에 번들되지 않음을 의미하는 "트리 떨림"을 수행합니다. import React/React.Component으로 모든 React의 소스 코드가 번들 될 것이라는 것을 보장합니다. import { Component }을 사용하면 일부 도구는 Component 클래스를 사용하는 데 필요한 코드 만 번들로 제공하며 나머지는 제외합니다.

위의 단락은 JSX을 작성하기 위해 항상 현재 네임 스페이스에 React가 있어야하기 때문에이 특정 경우에는 관련이 없지만 필요한 경우 정확한 모듈 만 가져 오면 결국 번들 코드가 더 작아 질 수 있습니다.

그 이상의 경우 완전히 개인적인 취향입니다.

Answer 2

이러한 이름은 가져 오기 또는 네임 스페이스 가져 오기입니다. 우리는, React.Component을 확장 할 것

import React, { Component } from 'react'; 

class SomeComponent extends Component { ... } 

일반적으로하지만, 구성 요소 모듈이 네임 스페이스로 가져되어 있기 때문에, 우리가 Component, React.로 참조 할 수 있습니다 : 그들이하는 일은 허용 네임 스페이스에 모듈의 내용을 복사 기본적으로 필요하지 않습니다. 모든 React 모듈을 가져 오지만 중괄호 안의 모듈은 React 네임 스페이스 접두어가 액세스 할 때 필요하지 않도록 가져옵니다.

Answer 3

mozilla ES6 module docs을 읽으십시오. 그것은 필요한 모든 정보를 가지고 있습니다.