如何在 React Native 中仅更改特定的子样式 属性？

Question

代码：

<View style={mainContainerStyle}>
    <View style={style1}>
      {View1}
    </View>
    <View style={style2}>
      {View2}
    </View>
    <View style={style3}>
      {View3}
    </View>
    <View style={style4}>
      {View4}
    </View>
</View>

在这种情况下，我要检查：style1、style2、style3、style 4。这些是子样式属性。

如果我找到任何样式 { flexDirection: 'row' }，我应该制作它 'row-reverse'。如何做到这一点？请帮助我。

Answer 1

我认为您可以使用一个函数来执行该特定逻辑

function format(style) {
  if (style.flexDirection === 'row') {
    return Object.assign({}, style, { flexDirection: 'row-reverse' });
  }
  return style;
}

并总结：

<View style={mainContainerStyle}>
    <View style={format(style1)}>
      {View1}
    </View>
    <View style={format(style2)}>
      {View2}
    </View>
    <View style={format(style3)}>
      {View3}
    </View>
    <View style={format(style4)}>
      {View4}
    </View>
</View>