How to extend some style object in react native

Question

I want to make an base style and extend others by base.How to implement it in react native code.

tvSmallDefault : {fontSize : Dimens.tvDefaultSmall, color : Colors.black},
tvNormalDefault : {fontSize : Dimens.tvDefaultNormal, color : Colors.black},

Here i gave black color in both above styles. How to make an base style and use it in both, something like this.

base: {color : Colors.black},
tvSmallDefault parent base: {fontSize : Dimens.tvDefaultSmall},
tvNormalDefault parent base : {fontSize : Dimens.tvDefaultNormal},

Answer 1

You could declare the base style as an object, then mix it in using the ... spread operator (or Object.assign if the spread operator isn't available)

const baseStyle = { color: Colors.black }

const tvSmallDefault = { ...baseStyle, fontSize: Dimens.tvDefaultSmall }
const tvNormalDefault = { ...baseStyle, fontSize: Dimens.tvDefaultNormal }

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax