Tuesday, 27 November 2018

React-native and Redux healthy way to call actions on props change

I've been using react-native with redux for a while, and the way i learn to call actions when something change on prop is using the componentWillReceaveProps, but when i use it i need to pass between if's and some times it goes to the wrong if, then i need to add more stuffs to prevent it.

An example of things i have done. I know this is not the best way to do i, but is what i could think of.

componentWillReceiveProps(newProps) {
    if(Object.keys(newProps.selected_product).length > 0) {
        if(Object.keys(this.props.current_location).length > 0 || Object.keys(newProps.current_location).length > 0) {
            this._handleNextPage(2);
            this.props.verifyProductById(newProps.selected_product, newProps.current_location, this.props.token);
        } else {
            this.props.statusScanner(false);
            this._handleNextPage(1);
        }
    } else if(Object.keys(newProps.historic_product_confirm).length > 0) {
        if(newProps.historic_product_confirm.location._id == newProps.current_location._id)
            this.props.handleModalConfirmPrice(!this.props.modal_confirmPrice_status)
    } else if(newProps.scanResult != "") {
        this.props.statusScanner(false);
        if(Object.keys(newProps.current_location).length > 0) {
            this._handleNextPage(2);
        } else {
            this._handleNextPage(1);
        }
    } else {
        this._handleNextPage(0);
    }
}

What i want is need a healthy way to call my actions when the props change.



from React-native and Redux healthy way to call actions on props change

No comments:

Post a Comment