Difference between style spread syntax and array syntax in React-Native

Viewed 730

I been using react native for a while and add this issue:

When using style={[style.container, { height: this.state.position }]} my view wasn't setting the desired height and my component was messed up. But then came across with style={{...style.container, height: this.state.position }} and my styles where working as expected.

What is the difference between on and the other?

1 Answers

Does style.container contain a value for 'height' ?

With the array syntax, the second object will overwrite any height value defined in the first object 'styles.container', using the spread operator as you have in your second example, you're defining one flat object of style properties, so the overwrite may not be happening consistently.

Related