Question

我最近在我的项目中添加了react-native-navigation，现在我无法使用导入的样式表。我想要做的是：

{% set a = 'initial' ~ ((foo == bar) ? ' concatenate' : '') %}

screenstyles.js：

{% set b = 'initial' ~ ((foo == foo) ? ' concatenate') %}

但我只是得到一个带有无样式文本的默认白屏。

我现在获得任何类型的导入样式的唯一方法是通过这样做

import screenstyles from './screenstyles';

class Screen extends Component {

 render() {
   return (
     <View style={screenstyles.container}>
       <Text style={screenstyles.basictext}>Text I want to display</Text>
     </View>
  );
 }

Container.js：

import EStyleSheet from 'react-native-extended-stylesheet';

export default EStyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: '$primaryBlue'
  },
  basictext: {
    color: "#fff",
    fontSize: 34
  }
});

这种方法并不是最好的，因为它使得为每个屏幕使用相同的样式表变得更加困难，但仍然能够自定义屏幕。

Answer 1

尝试重写screenstyles.js文件，如下所示：

const React = require('react-native-extended-stylesheet');
const { EStyleSheet } = React;

var styles =  EStyleSheet.create({
   container: {
      flex: 1,
      alignItems: 'center',
      justifyContent: 'center',
      backgroundColor: '$primaryBlue'
   },
   basictext: {
      color: "#fff",
      fontSize: 34
   }
});

module.exports = styles;

添加react-native-navigation后导入的样式表无法正常工作

1 个答案: