将我的背景颜色转移到另一个 JS 类

Question

我有一个带有 login.js 的 React Native 项目。在这个类中，我有几个视图等。这些视图使用在类中定义的样式表。现在我尝试将背景颜色提取/传输到“容器类”（values.js）中，我可以在其中获取颜色（rgba）并在我的 login.js 类中使用它。既然我这样做了，颜色就不会再显示任何东西了。它是纯白色的，它不采用我定义的某种红色。

这是我的登录代码： login.js

var Values=require('../values/values');

...
<View style={styles.titleContainer}>
    <Text style={styles.titleText}>{Strings.login}</Text>
</View>
...

var styles = StyleSheet.create({
container: {
    flexDirection: 'column',
    flex: 1
},
bg: {
    position: 'absolute',
    left: 0,
    top: 0,
    width: windowSize.width,
    height: windowSize.height
},
titleContainer: {
    justifyContent: 'center',
    alignItems: 'center',
    flex: 0.15,
    backgroundColor: Values.Color.COLOR_NAVIGATION_BAR,
},
})

这是我的“颜色容器/颜色集”： 值.js

module.exports = {

API: [
    {
        //API
        API_BASE_URL: "",
        //LOCAL
        API_LOCAL_URL: "http://localhost:1986/",
    }],

Color: [
    {
        COLOR_NAVIGATION_BAR: 'rgba(163,63,59,1)',
        ......
        .....
    }],

Answer 1

我认为问题在于您用作导出对象的 API 和颜色字段的数组。您导出的对象包含两个字段：API 和 Color，它们都是对象数组。因此，如果您想引用颜色值，则可以使用类似的方法：

Values.Color[0].COLOR_NAVIGATION_BAR

但这可能不是你真正想要的。您的定义很可能应该如下所示（请注意，为了保持一致性，可能最好在颜色和值中使用全部大写）：

module.exports={
    API: {
        API_BASE_URL: "",
        ...
    },
    COLOR: {
        COLOR_NAVIGATION_BAR: 'rgba(163,63,59,1)',
        ...
    }
}

您应该将其导入/引用为：

var VALUES=require('../values/values');
....

backgroundColor: VALUES.COLOR.COLOR_NAVIGATION_BAR,
...