मेरा संदर्भ घटक क्यों है मेरा प्रतिक्रिया घटक में अपरिभाषित?

Question

मैं अपने घटक के भीतर से अपने router तक पहुंचने का प्रयास कर रहा हूं और यह अनिर्धारित है। यहाँ मेरी router है:

class LoginContainer extends React.Component { 
    constructor() { 
    super(); 
    } 

    static propTypes = { 
    handleLogin: PropTypes.func.isRequired 
    } 

    static contextTypes = { 
    router: React.PropTypes.object 
    } 

    handleLogin() { 
    this.props.dispatch(Actions.login(null, null, this.context.router)); 
    } 

    render() { 
    return (
     <Login 
     auth={this.props} 
     handleLogin={this.handleLogin} 
     /> 
    ); 
    } 
} 

function mapStateToProps(state) { 
    return { 
    stuff: [] 
    } 
} 


export default connect(mapStateToProps)(LoginContainer); 

और अंत में घटक:

import React, { PropTypes } from 'react'; 

class Login extends React.Component { 
    static propType = { 
     handleLogin: PropTypes.func.isRequired 
    } 
    static contextTypes = { 
     router: React.PropTypes.object 
    } 
    render() { 
     return ( 
      <div className="flex-container-center"> 
       <form> 
        <div className="form-group"> 
         <button type="button" onClick={this.props.handleLogin}>Log in</button> 
        </div> 
       </form> 
      </div> 
     ); 
    } 
} 

module.exports = Login; 

जब मैं login बटन पर क्लिक करें, उस में handleLogin हिट

React.render(
    <Provider store={store}> 
     {() => 
      <Router> 
       <Route path="/" component={LoginContainer} /> 
      </Router> 
     } 
    </Provider>, 
    document.getElementById('app') 
); 

यहाँ कंटेनर है कंटेनर। मेरे handleLogin में, मेरे this मान undefined है। मैंने में फ़ंक्शन में this को बांधने का प्रयास किया है, लेकिन यह अभी भी undefined है।

इसके अलावा, जब मैं अपने render फ़ंक्शन में ब्रेकपॉइंट डालता हूं, तो मेरे पास this.context.router है, लेकिन यह undefined है। मैं अपने this को अपने handleLogin में सही कैसे प्राप्त करूं और मैं यह सुनिश्चित कैसे करूं कि मेरे पास routercontext पर है और यह undefined नहीं है?

Answer 1

परिवर्तनों को बनाए रखने का सबसे अच्छा तरीका Releases पृष्ठ को देखना है।

प्रतिक्रिया राउटर संस्करणों में > 1.0.0-beta3 और < 2.0.0-rc2, context.router कोई नहीं है। इसके बजाय, आपको context.history देखने की आवश्यकता है।

यदि आप संस्करण <= 1.0.0-beta3 या >= 2.0.0-rc2 का उपयोग करते हैं, तो context.router है। संक्षेप में, क्या हुआ यह history के पक्ष में हटा दिया गया था लेकिन फिर रखरखावकर्ताओं ने राउटर के पीछे इतिहास लाइब्रेरी एपीआई को छिपाने का सबसे अच्छा फैसला किया, इसलिए वे 2.0 आरसी 2 और आगे के router संदर्भ को वापस ले गए।