reactjs - react native : All styles in StyleSheet object after exporting were converted to number type

Question

我的样式对象:mainModule/styles.js

export default StyleSheet.create({
  container: {
    width: 0
  },
  basicInfo: {
    height: 167,
    backgroundColor: 'red,
    justifyContent: 'center',
    alignItems: 'center'
  }
}

当我导入 import GeneralStyle from '@mainModule/styles' 时(我创建了一个 package.json 文件以使该路径有效) 控制台日志显示如下:

对象{ 容器:10个， 基本信息:118 }

这里有人可以帮助我吗？

Answer 1

@NellyNgo，您可能试图展平 StyleSheet.create 返回的整个对象。我做了同样的事情，这让我发疯，因为它似乎对其他人都有效，但对我来说返回了我传递给它的相同值。实际上，展平适用于由 StyleSheet.create 创建的对象的单独属性。像这样:

const styles = StyleSheet.create({prop: {...}, prop2: {...})

然后你可以做StyleSheet.flatten(styles.prop)

检查node_modules/react-native/Libraries/StyleSheet/flattenStyle.js中的代码。这就是我失败的地方。

 function getStyle(style) {
          if (typeof style === 'number') {
            return ReactNativePropRegistry.getByID(style);
          }
          return style;
     }

如果有兴趣，请检查整个来源

我的 RN 版本是 0.41.2