Question

我是新手。现在我必须在我的项目中管理两个或更多样式表文件。

我当前的样式表代码：

'use strict';
import { Platform } from 'react-native'
var React = require('react-native');
var {StyleSheet,} = React;
import {NavBar, TabBar} from './UiConfig'
import MyComponents from './styles/MyComponents'

const MyStyleTheme = StyleSheet.create({
    middle: {
        alignItems: "center",
        justifyContents: "center"
    },
    NavBar: {
        backgroundColor: NavBar.bgColor //from UiConfig
    }
})

export default MyStyleTheme

另一个文件：

'use strict';
    import { Platform } from 'react-native'
    var React = require('react-native');
    var {StyleSheet,} = React;

    const MyComponents = StyleSheet.create({
        Navigator: {
            ...
            ...
        }
    })

    export default MyComponents

那么......有可能导入主样式表而不是像CSS @import那样导入另一个样式表吗？

index.ios.js:

import React, { Component } from 'react'
import {
    StyleSheet,
    StatusBar,
    Text,
    View,
} from 'react-native'
import MyStyleTheme from '../primaryStyles'

...
...
...

render(){
    return(
        <View style={[MyStyleTheme.middle]}>
            <View style={[MyStyleTheme.MyComponents]}>
        </View>
    );
}

Answer 1

嗯......我找到了解决问题的方法：

const obj = { flex: 1, justifyContent: "center", alignItems: "center" }  

const MyComponents = StyleSheet.create({
    Navigator: {
        ...obj,
        height: 44
    }
})

在React Native中，如何将另一个样式表导入当前样式表？

1 个答案: