कंटेनर

Question

प्रस्तुत करने से पहले रेडक्स प्रेषण कार्रवाई पर प्रतिक्रिया दें मैं प्रतिक्रिया-रेडक्स अनुप्रयोग विकास के लिए बहुत नया हूं और मैं यह समझने की कोशिश कर रहा हूं कि पृष्ठ लोड होने पर एक और कार्रवाई कैसे प्रेषित करें। मेरा कंटेनर कोड निम्नलिखित है। मैं इसका उपयोग कर रहा हूं (https://github.com/jpsierens/webpack-react-redux) बॉयलरप्लेट। setState (...): एक मौजूदा राज्य संक्रमण शायद इसलिए क्योंकि मैं समारोह प्रस्तुत करना (IDK) के दौरान एक एक्शन भेजने रहा दौरान अद्यतन नहीं कर सकते

let locationSearch; 

const ActivationPage = ({activateUser}) => { 
    return (
     <div className="container"> 
      <h2>Activation Required</h2> 
      <p>An Activation Email was sent to your email address. Please check your inbox to find the activation link</p> 
      { activateUser() } 
     </div> 
    ); 
}; 


ActivationPage.propTypes = { 
    activateUser: PropTypes.func 
}; 


const mapStateToProps = (state) => { 
    return { 
     message: state.message, 
     currentUser: state.currentUser, 
     request: state.request 
    }; 
}; 

const mapDispatchToProps = (dispatch) => { 
    return { 
     activateUser:() => { 
      console.log(location); 
      if (location.search !== '') { 
       locationSearch = querystring.parse(location.search.replace('?', '')); 
       console.log(locationSearch); 
       if (locationSearch.hasOwnProperty('user_id') && locationSearch.hasOwnProperty('activation_code')) { 
        // change request state to pending to show loader 
        dispatch(actions.requestActions.requestPending()); 

       } 
      } 
     } 
    }; 
}; 

export default connect(
    mapStateToProps, 
    mapDispatchToProps 
)(ActivationPage); 

इस संहिता मुझे चेतावनी देता है। पृष्ठ लोड होने के तुरंत बाद सक्रिय उपयोगकर्ता उपयोगकर्ता() फ़ंक्शन को ट्रिगर करने के लिए दिए गए कोड को मैं कैसे परिवर्तित कर सकता हूं।

Answer 1

https://facebook.github.io/react/docs/react-component.html

componentWillMount() और आप के लिए componentDidMount()। और मेरी राय - आप componentWillMount उपयोग करने से बचें और componentDidMount को प्राथमिकता देनी चाहिए - यह आप somewhen

Answer 2

प्रतिपादन सर्वर का उपयोग किया जाएगा, तो मतलब है समझे बाद मैं घटक परिवर्तित एक class जो extends Component इस उत्तर यहाँ मदद की जा करने के लिए यह काम कर रहा मुझे कुछ अवधारणाओं के साथ How do you mix componentDidMount() with react-redux connect()? उन लोगों के लिए कार्यान्वयन निम्नलिखित है जो इस बारे में उलझन में हो सकते हैं।

import React, { Component, PropTypes } from 'react'; 
import { connect } from 'react-redux'; 
import actions from '../actions'; 

let locationSearch; 

class ActivationPage extends Component { 
    constructor(props) { 
     super(props); 
    } 

    componentDidMount() { 
     this.props.activateUser(); 
    } 

    render() { 
     return (
     <div className="container"> 
      <h2>Activation Required</h2> 
      <p>An Activation Email was sent to your email address. Please check your inbox to find the activation link</p> 
     </div> 
     ); 
    } 
} 

ActivationPage.propTypes = { 
    activateUser: PropTypes.func 
}; 

const mapStateToProps = (state) => { 
    return { 
     request: state.request 
    }; 
}; 

const mapDispatchToProps = (dispatch) => { 
    return { 
     activateUser:() => { 
      if (location.search !== '') { 
       locationSearch = querystring.parse(location.search.replace('?', '')); 
       if (locationSearch.hasOwnProperty('user_id') && locationSearch.hasOwnProperty('activation_code')) { 
        // change request state to pending to show loader 
        dispatch(actions.requestActions.requestPending()); 
       } 
      } 
     } 
    }; 
}; 

export default connect(
    mapStateToProps, 
    mapDispatchToProps 
)(ActivationPage);