Question

我正在尝试使用react-native设置全局样式。我已导入

import {injectGlobal} from 'styled-components';

并且

class XoxoContainer extends Component {
  render() {
    return <Xoxo {...this.props} />
  }
}


injectGlobal`
  font-family: '20'
`;

但我一直在控制台中获得styledComponents.injectGlobals is not a function.。

Answer 1

该函数不属于react-native according to this Github issue.库的一部分。这就是为什么它一直说它不是函数，因为它无法找到它。

Answer 2

创建一个这样的styles.js文件：

import React, {Component} from 'react';
import {
    Platform,
    StyleSheet
} from 'react-native';

export const styles = StyleSheet.create({
    view_flex_one_white: {
    flex: 1,
    backgroundColor: white
}});

并使用导入

在您的应用中的任何位置使用此功能

    import {styles} from "...link to file/styles";

      render(){
         return(
           <View style={styles.view_flex_one_white}>

           </View>
    )
}

Answer 3

使用此模式创建一个js文件：

'use strict';

var React = require('react-native');

var myStyle = React.StyleSheet.create({
   style1: { },
   style2: { }
)}

module.exports = myStyle;

你的组件js使用要求使用该样式表

var customStyle = require('../the/path/to/commonStyleSheet');

现在就这样使用：

<View style = {customStyle .style1} />

无法在样式化组件中使用全局样式

3 个答案: