ReactJS applicano molteplici stili inline

Question

Diciamo che ho i seguenti stili:

const styles = StyleSheet.create({ 
padding: { 
    padding: 10 
}, 
margin: { 
    margin: 10 
} 
}); 

e voglio applicare sia di loro di un componente di reagire?

Answer 1

Mentre ho fatto qualche ricerca per questo, la risposta non è inmediatly chiaro, un suggerimento è:

<View style={Object.assign({}, styles.padding, styles.margin)}> 
    ... 
</View> 

Object.assign() batte un elenco di argomenti e li unisce, però, se si don' passare il primo oggetto vuoto sovrascriverà il primo argomento, quindi se vuoi mantenere gli stili puliti devi passarlo.

Tuttavia come reagire 0,27.2 ho ottenuto un errore di allineamento cercando di fare questo.

Alcuni approfondimenti rivelato:

<View style={StyleSheet.flatten([styles.postHeader, styles.flowRight])}> 
    ... 
</View> 

funziona bene, ma questo è molto prolisso e non proprio intuitivo, dopo che mentre ho trovato un altro frammento:

<View style={[styles.postHeader, styles.flowRight]}> 

Per tutti gli effetti questo era quello che stavo cercando.

Ho solo pensato di condividere questa conoscenza qui poiché sembra abbastanza ovvio ma non ho trovato alcuna documentazione per questo.