React-Router HOC/withRouter에 대한 ES6 구문이 있습니까?

React-Router "withRouter"구성 요소에 ES6 extend 기능을 사용하는 방법이 있습니까? 이 같은React-Router HOC/withRouter에 대한 ES6 구문이 있습니까?

뭔가 :

import { withRouter } from 'react-router'; 

export default class extends withRouter { 
    ... 
    //Use react router history prop to navigate back a page. 
    handleSomeEvent() { 
    this.props.router.goBack(); 
    } 
    ... 
}

아니면 이전 구성 패턴을 사용하여 막혔어요?

var MyComponent = React.createClass({ 
    ... 
}); 
export default withRouter(MyComponent);

출처

2016-08-01 Noah Solomon

예, 그것은 쉽게, (... 구성 요소가 장착 된 후 2 초를 리디렉션해야 말을 그냥 예)를 넣고 볼을 포함해야합니다.

BTW 반응 라우터의 내 버전 내가이 지금까지 가장 가까운 것 같다 2.6 (2.4+ withRouter에 필요)

import React, { Component } from 'react'; 
import { withRouter } from 'react-router'; 

class MyComponent extends Component { 
    componentDidMount() { 
     setTimeout(() => { 
      this.props.router.push('my-url') 
     }, 2000); 
    } 

    render() { 
     return (
      <div>My Component</div> 
     ); 
    } 
} 

export default withRouter(MyComponent);

출처

2016-08-15 10:08:37

입니다. 나는 명명 된 클래스와 함께 컴포지션을 사용하는 것에 대해 생각하지 않았습니다. 나는'class MyComponent extends withRouter'를 원했지만 지금은 그렇게 할 것이라고 생각합니다. –

미친 것처럼 보일 수도 있지만 정상적으로 작동합니다. 나는 심지어 redux와 내 "권한 컨트롤러"고차원 컴포넌트와 함께 사용한다. 'export default connect (mapStateToProps, {fetchCampaigns}) (AuthorizedComponent (Campaigns));' –

@MarekJalovec 주석의 예제에서, 너 뒀어? 루터? 그것은 :'default_connect (mapStateToProps, {fetchCampaigns}) (AuthorizedComponent (withRouter (Campaigns))); –

이렇게 사용할 수 있습니다.

@withRouter 
export default class extends withRouter { 
    ... 
    //Use react router history prop to navigate back a page. 
    handleSomeEvent() { 
    this.props.router.goBack(); 
    } 
    ... 
}

하지만 당신은 babel-plugin-transform-decorators-legacy

출처

2016-08-04 06:24:58 Deadfish

React-Router HOC/withRouter에 대한 ES6 구문이 있습니까?

답변

관련 문제