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

Question

我有一个带有 login.js 的 React Native 项目。在这个 class 中，我有几个视图等。这些视图使用在 class 中定义的样式表。现在我尝试将 extract/transfer 背景颜色转换为 "container class"(values.js)，在那里我可以获得颜色 (rgba) 并在我的 login.js class 中使用它.自从我这样做以来，颜色就不会再显示任何东西了。它是纯白色的，并没有采用我定义的某种红色。

这是我的登录码： 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,
},
})

这是我的"color container/color sets"： values.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 和颜色，它们都是对象数组。所以如果你想参考颜色值，像这样的东西会起作用：

Values.Color[0].COLOR_NAVIGATION_BAR

但这可能不是您真正想要的。您的定义很可能应该看起来像（请注意，为了保持一致性，最好在颜色和值中使用所有大写字母）：

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

并且您应该 import/refer 将其设为：

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

backgroundColor: VALUES.COLOR.COLOR_NAVIGATION_BAR,
...

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

Transfering my background Color into a nother JS-Class

javascript

css

react-native