'기본 불변 수출'이 유효하지 않은 이유

다음과 같은 것이 좋습니다.

const Tab = connect( mapState, mapDispatch )( Tabs );
export default Tab;

그러나 이것은 올바르지 않습니다.

export default const Tab = connect( mapState, mapDispatch )( Tabs );

그러나 이것은 괜찮습니다.

export default Tab = connect( mapState, mapDispatch )( Tabs );

이것이 왜 const유효하지 않은지 설명 할 수 있습니까 export default? 불필요 한 추가 및 기타로 export default추정되는 것이 const있습니까?

const처럼 let, 그것은이다 LexicalDeclaration ( VariableStatement 선언 하여 블록 식별자를 정의하는 데 사용).

이 default키워드를 HoistableDeclaration, ClassDeclaration 또는 AssignmentExpression 이 따라 올 것으로 예상하는 키워드 와 혼합하려고 합니다.

따라서 SyntaxError 입니다.

const무언가 를 원한다면 식별자를 제공하고 사용하지 않아야합니다 default.

export그 자체로는 VariableStatement 또는 Declaration 을 그 자체로 받아들 입니다.

AFAIK 내보내기 자체는 현재 범위에 아무것도 추가하지 않아야합니다.

다음은 괜찮습니다export default Tab;

Tab된다 AssignmentExpression 는 이름이 주어진 것 같은 기본은 ^?

export default Tab = connect( mapState, mapDispatch )( Tabs ); 괜찮습니다

다음 Tab = connect( mapState, mapDispatch )( Tabs );은 AssignmentExpression 입니다.

대신 기본 const / let을 내보내려면 다음과 같이 할 수 있습니다

const MyComponent = ({ attr1, attr2 }) => (<p>Now Export On other Line</p>);
export default MyComponent

나는 개인적으로 좋아하지 않는 이와 같은 것을 할 수 있습니다.

let MyComponent;
export default MyComponent = ({ }) => (<p>Now Export On SameLine</p>);

구성 요소 이름이 파일 이름에 설명되어 있으면 구성 요소 이름을 지정 MyComponent.js하지 말고 코드를 줄이십시오.

import React from 'react'

export default (props) =>
    <div id='static-page-template'>
        {props.children}
    </div>

업데이트 : 스택 추적에서 알 수없는 것으로 표시되므로 권장하지 않습니다.

폴의 대답은 당신이 찾고있는 것입니다. 그러나 실제로는 내 React + Redux 앱에서 사용한 패턴에 관심이있을 것입니다.

다음은 내 경로 중 하나에서 제거 된 예제입니다. 단일 명령문으로 구성 요소를 정의하고 기본값으로 내보내는 방법을 보여줍니다.

import React from 'react';
import { connect } from 'react-redux';

@connect((state, props) => ({
    appVersion: state.appVersion
    // other scene props, calculated from app state & route props
}))
export default class SceneName extends React.Component { /* ... */ }

(참고 : 모든 루트의 최상위 구성 요소에 "장면"이라는 용어를 사용합니다).

도움이 되길 바랍니다. 기존보다 훨씬 깨끗해 보인다고 생각합니다connect( mapState, mapDispatch )( BareComponent )

바울이 공유 한 답이 가장 좋습니다. 더 확장하려면

파일 당 하나의 기본 내보내기 만있을 수 있습니다. const 내보내기가 둘 이상있을 수 있습니다. 기본 변수는 임의의 이름으로 가져올 수 있지만 const 변수는 특정 이름으로 가져올 수 있습니다.

var message2 = '내보냈습니다.';

기본 메시지 내보내기 2;

const 메시지 내보내기 = '내보냈습니다.'

수입 측에서는 다음과 같이 수입해야합니다 :

'./test'에서 {message} 가져 오기;

또는

'./test'에서 메시지 가져 오기;

첫 번째 가져 오기에서는 const 변수를 가져오고 두 번째 가져 오기에서는 기본 변수를 가져옵니다.

default 기본적으로 const someVariableName

파일의 기본 내보내기이기 때문에 이름 지정된 식별자가 필요하지 않으며 파일을 가져올 때 원하는 이름을 지정할 수 있으므로 default변수 할당을 단일 키워드로 압축하면됩니다.

나에게 이것은 사람들이 머리카락을 뽑아 개발자를 저주하게하는 많은 종류의 특이성 중 하나 (idio (t) 강조)입니다. 더 이해하기 쉬운 오류 메시지가 표시 될 수도 있습니다.