如何在react-native中组合多个内联样式对象和内联CSS？

Question

如何在react-native中组合多个内联样式对象和内联CSS？

它有3个样式对象TimelineGreenColor，TimelineLeftBorder，TimelineLeftLine用于视图div

  const stylesB = StyleSheet.create( {
     TimelineGreenColor:
     {
       backgroundColor: "green",
     },
     TimelineLeftBorder:
     {
       position: 'absolute',
       width: 4,
       backgroundColor: "green",
       height: '100%',
       left: 4,
       top: 15,
     },
     TimelineLeftCircle:
     {
       position: 'absolute',
       width: 12,
       height: 12,
       backgroundColor: "green",
       top: 12,
       borderRadius: 50,
       left: 0,
       /*boxShadow: "0px 0px 10px -2px black",*/
     },
     TimelineLeftLine:
     {
       position: 'absolute',
       width: 15,
       height: 3,
       backgroundColor: "green",
       top: 16,
       left: 5,
   }

   <View style={how to write styles in react-native ??????????}></View>

Answer 1

类型1：如果您有一种内联样式

<View style = {{marginLeft: 7,paddingRight: "9%"}}></View>

类型2：如果样式对象中有一种样式

<View style = {styles.TimelineLeftBorder}></View>

类型3：如果您有来自样式对象的两个或更多样式，则>]

<View style = {[styles.TimelineLeftBorder,styles.TimelineGreenColor]}></View>

类型4：如果您有来自样式对象的两个或多个样式，并且还希望提供普通的内联CSS

<View style = {[styles.TimelineLeftBorder,styles.TimelineGreenColor,{marginLeft: 7}]}></View>