Support array of objects in style property

[jacobrask]

As proposed in React Future, it would be nice to support a list of style objects in the style property. The objects would be automatically merged (in order, with the last object overriding the previous one).

var boxStyle = {
  padding: 10,
  background: "hotpink"
};
var bixBoxStyle = {
  margin: 10,
  width: 300
};

<div style={boxStyle} />
<div style={[boxStyle, bigBoxStyle]} />
<div style={[boxStyle, bigBoxStyle, {background: "navy"}]} />

[SanderSpies]

Duplicate of: #2196

[phtn]

<div style={ Object.assign( {}, boxStyle, bigBoxStyle, {background: "navy"} ) }>

this should merge declared styles as well as specific in-line style like background.
background in boxStyle will be overwritten in this order of Object assignment.

[quantuminformation]

What is the preferred way to do it today?

[jsu93]

@quantuminformation https://github.com/jsu93/babel-plugin-styles

[agustind]

You can use the spread operator

style={{...styles.box, ...styles.bigBox}}