Q:

Better use of conditional render with SetState (React Native)

I'm rendering a list of products according to a specific value. I'm doing the render with a Picker Component and when it's different of 306, I'm loading the selected products but IF I come back on the first PickerItem (306) I want to show ALL the products again...
For instance :
if (Value != '306') {
        this.setState({
            // isAll: false,
            labels,
            Colours: Value,
            filteredProducts: this.state.displayProducts.filter(product => product.colour == Value)
        }, () => {
            this.onLoadFilteredLabels();
        });
    } else {
        this.setState({
            // isAll: true,
            Colours: Value,
            displayProducts: this.state.products,
            displayLabels: this.state.labels
        });
    }

I'm looking for some advice if there is a better way of doing this ?
Do you think I should separe every setState ?
It's working but I have the feeling that it's a bit tricky and I'm still learning. So I know I can have goods advices here with people here !
Thank you

A:

You can make use of ternary operator, equality check etc. So that your code will look clean. For example,
this.setState({
  isAll: Value === '306',
  filterProducts: Value === '306' ? [yourFilterProducts] : [] 
});

