CODEWITHSUNDEEP
javascriptreactjsreduxreact-reduxredux-saga
ayxos
ayxos

Reputation: 408

How should the react component re-render itself when props from redux have been updated?

I have a "checkProps()" function that checks if props are empty or not and renders the view if so.

Right now runs on every view render, but since the fn checks just the props, and those come from the redux mapper I think is not a very good approach, performance-wise talking.

I have considered use "componentWillReceiveProps/getDerivedStateFromProps" but according to some sites, that might be an antipattern and I should avoid the use of those methods.

What should be the right way to perform props-ops just when the props are updated and not on every render?

Upvotes: 0

Views: 188

Answers (1)

Dupocas
Dupocas

Reputation: 21317

To perform custom comparison in props (not just shallow) you should use [componentDidUpdate][1] which provides you prevProps and prevState to compare with the current ones:

componentDidUpdate(prevProps){
    if(prevProps.items.length !== this.props.items.length)
        this.setState({items: this.props.items})
}

Upvotes: 1

Related Questions