React 구성 요소에 es6 가져 오기 별칭 구문을 사용할 수 있습니까?

Question

나는, 그러나 그것은 null을 반환, 다음과 같은 일을하려고 해요 :

import { Button as styledButton } from 'component-library' 

는 다음을 렌더링하는 시도로 : 그 이유는

import React, { PropTypes } from "react"; 
import cx from 'classNames'; 

import { Button as styledButton } from 'component-library'; 

export default class Button extends React.Component { 
    constructor(props){ 
     super(props) 
    } 
    render() { 
     return (
       <styledButton {...this.props}></styledButton> 
     ) 
    } 
} 

, 내가 Button 구성 요소를 가져올 필요 또한 라이브러리에서 가져온 구성 요소의 기능을 그대로 유지하면서 같은 이름의 래퍼 구성 요소를 내보낼 수 있습니다. 내가 import { Button } from component library에 남겨두면 물론 여러 선언 오류가 발생합니다.

아이디어가 있으십니까?

Answer 1

귀하의 구문이 유효합니다. JSX는 React.createElement (type)에 대한 구문 설탕이므로 type이 유효한 React 유형이면 JSX "tags"에서 사용할 수 있습니다. Button가 null의 경우, 임포트가 올바르지 않은 어쩌면 Button이 component-library의 기본 내보내기 일 수 있습니다. 시도해보십시오 :

import {default as StyledButton} from "component-library"; 

Answer 2

왜 내가 별명을 가져올 수 없습니까?

import React, { PropTypes } from "react"; 
import * as StyledLibrary from 'component-library'; 

export default class Button extends React.Component { 
    constructor(props){ 
     super(props) 
    } 
    render() { 
     return (
      <StyledLibrary.Button {...this.props}></StyledLibrary.Button> 
     ) 
    } 
} 

감사합니다 모두 당신이 클래스 버튼의 이름을 변경할 수없는 이유