时间戳

首页 > 解决方案 > 如何在本机反应中仅更改特定的子样式属性？

javascript - 如何在本机反应中仅更改特定的子样式属性？

问题描述

代码：

<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'。如何做到这一点？请帮我。

标签： javascriptreactjsstylesheet

解决方案

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

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>

推荐阅读