Sign in
Log inSign up

ReactJS: How to render components only after successful asynchronous call?

Anand Reddy Rikka's photo
Anand Reddy Rikka
·Dec 19, 2016

I'm from angular background and trying to learn reactjs by implementing a website(https://tmdbredux.herokuapp.com). Now and then I face issues and try to find answers, but this one I havn't found a proper way to do it.

How to render react components after only successful asynchronous calls

class CardComponent extends Component {
    constructor(props) {
            super(props);
    }
    componentDidMount() {
        //doing some asynchronous call here which dispatches an action 
        //and updates the state -> which inturn renders the component again.
        //I want component to be rendered after this happended. Is it possible ?
    }
    //This render is begin called even before props getting updated
    render() {
        return (
            <div>Component Rendered Here </div>
        )
    }
}

Being from angular background I'm facing tough time to handle null conditions on object, because without props getting updated with appropriate data object might throw errors.

Please suggest any good practices or solution for the problem

Thanks in Advance