React native:如何组合外部和内联样式？

Question

这是_renderRow函数的一部分.我有一些按钮的基本样式,以及从行上的变量读取的样式.在这个例子中,它是'#f00',但它可以是变量,如thisColor.如何将外部样式与内联样式相结合？

像这样的东西,但这不起作用:

<TouchableHighlight style={[styles.button]{ backgroundColor: '#f00'}}   

或者我是否必须将其与TouchableHightlight中的容器嵌套,并将内联样式放在该元素上？

Answer 1

你的括号错了.如果您打算继续使用数组语法,请改用:

<TouchableHighlight style={[styles.button,{ backgroundColor: '#f00'}]} 

Answer 2

可以使用扩展语法:

<TouchableHighlight style={{ ...styles.button, backgroundColor: '#f00'}}