2017-04-18 41 views
4

我得到Object.freeze只能(仅适用于Android)呼吁的对象。获得Object.freeze只能在对象被称为Android上

一些深层次的研究,我发现,这是因为我引用我的风格在不同的文件夹中,Android是很不高兴。

Github Issue

Image

我的文件夹结构

  • SRC

    • 行动
    • 集装箱
      • Home.js(有风格)
    • 组件
    • 风格
      • calculateSize.js
      • index.js
  • App.js

  • Router.js(有风格)

正如你可以看到模拟器开始于

Router.js: 9 

相当于

import styles from './styles'; // Line 9 in Router.js 

朗抱怨故事总之,如果我在想要做st的文件中创建本地StyleSheet变量,问题才会消失这很烦人。

任何人有遇到过吗?我无法找到一个解决办法:(

这是我的风格指数,或许一些方法使不确定的,我不知道它

calculateSize

import { Dimensions } from 'react-native'; 
 

 
const deviceWidth = Dimensions.get('window').width; 
 
const deviceHeight = Dimensions.get('window').height; 
 

 
// Calculating ratio from iPhone breakpoints 
 
export const ratioX = deviceWidth < 375 ? (deviceWidth < 320 ? 0.75 : 0.875) : 1 ; 
 
export const ratioY = deviceHeight < 568 ? (deviceHeight < 480 ? 0.75 : 0.875) : 1 ; 
 

 
// Set our base font size value 
 
const base_unit = 16; 
 

 
// Simulating EM by changing font size according to Ratio 
 
const unit = base_unit * ratioX; 
 

 
export default function em(value) { 
 
    return (unit * value); 
 
}

指数。JS

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

 
import em from './calculateSize'; 
 

 
const deviceWidth = Dimensions.get('window').width; 
 
const deviceHeight = Dimensions.get('window').height; 
 

 
export const colors = { 
 
    gray: '#888888', 
 
}; 
 

 
export default StyleSheet.create({ 
 
    // 
 
    // STATICS 
 
    // 
 
    DEVICE_WIDTH: deviceWidth, 
 
    DEVICE_HEIGHT: deviceHeight, 
 
    RATIO_X: em.ratioX, 
 
    RATIO_Y: em.ratioY, 
 
    UNIT: em(1), 
 
    PADDING: em(1.25), 
 
    
 
    FONT_SIZE: em(1), 
 
    FONT_SIZE_SMALLER: em(0.75), 
 
    FONT_SIZE_SMALL: em(0.875), 
 
    FONT_SIZE_TITLE: em(1.25), 
 
    // 
 
    // REACT-NATIVE-ROUTER-FLUX 
 
    // 
 
    navigationBarStyle: { 
 
    backgroundColor: '#dd2c00', 
 
    borderBottomWidth: 0, 
 
    }, 
 
    navTitleStyle: { 
 
    color: 'white', 
 
    }, 
 
    navBarButton: { 
 
    position: 'absolute', 
 
    top: 10, 
 
    }, 
 
    navBarLeftButton: { 
 
    left: 10 
 
    }, 
 
    navBarrightButton: { 
 
    right: 10 
 
    }, 
 
    // 
 
    // GENERALS 
 
    // 
 
    testShit: { 
 
    borderColor: 'red', 
 
    borderWidth: 2 
 
    }, 
 
    centerEverything: { 
 
    justifyContent: 'center', 
 
    alignItems: 'center', 
 
    }, 
 
    authContainer: { 
 
    flex: 1, 
 
    paddingTop: 50, 
 
    }, 
 
    bitOfTransparent: { 
 
    backgroundColor: 'rgba(0,0,0,.5)' 
 
    }, 
 
    // 
 
    // AUTHS 
 
    // 
 
    spanImage: { 
 
    height: deviceHeight, 
 
    width: deviceWidth, 
 
    }, 
 
    statusBarSpan: { 
 
    width: deviceWidth, 
 
    flexDirection: 'row', 
 
    justifyContent: 'space-between', 
 
    alignItems: 'center', 
 
    top: 20, 
 
    paddingLeft: 15, 
 
    paddingRight: 15, 
 
    position: 'absolute' 
 
    }, 
 
    residentValetUpperContainer: { 
 
    flex: .25, 
 
    width: deviceWidth*0.8 
 
    }, 
 
    residentValetBottomContainer: { 
 
    flex: .75, 
 
    width: deviceWidth, 
 
    alignItems: 'center', 
 
    justifyContent: 'flex-end', 
 
    paddingBottom: 20 
 
    }, 
 
    residentValetBottomContainerField: { 
 
    justifyContent: 'flex-start' 
 
    }, 
 
    residentValetText: { 
 
    fontSize: em(1)*1.5, 
 
    letterSpacing: 10, 
 
    textAlign: 'center', 
 
    color: '#fff', 
 
    backgroundColor: 'transparent', 
 
    }, 
 
    residentValetDesc: { 
 
    fontSize: em(1)*1.25, 
 
    letterSpacing: 0, 
 
    flexWrap: 'wrap' 
 
    }, 
 
    helLight: { 
 
    fontFamily: 'HelveticaNeue-Light', 
 
    }, 
 
    loginButton: { 
 
    flexDirection: 'row', 
 
    width: deviceWidth*0.9, 
 
    height: 50, 
 
    backgroundColor: 'transparent', 
 
    borderColor: '#fff', 
 
    borderWidth: 1, 
 
    borderRadius: 3, 
 
    }, 
 
    loginButtonText: { 
 
    fontSize: em(1), 
 
    color: '#fff', 
 
    paddingLeft: 10, 
 
    }, 
 
    policyText: { 
 
    fontSize: em(0.85), 
 
    color: '#fff', 
 
    backgroundColor: 'transparent' 
 
    }, 
 
    nextButtonText: { 
 
    fontSize: em(1.25), 
 
    fontWeight: '500', 
 
    backgroundColor: 'transparent' 
 
    }, 
 
    container: { 
 
    flex: 1, 
 
    ...Platform.select({ 
 
     ios: { 
 
     marginTop: 64 
 
     }, 
 
     android: { 
 
     paddingTop: 54 
 
     } 
 
    }) 
 
    } 
 
})

回答

3

的错误是由于你在StyleSheet.create调用具有非对象属性,即 -

// 
// STATICS 
// 
DEVICE_WIDTH: deviceWidth, 
DEVICE_HEIGHT: deviceHeight, 
RATIO_X: em.ratioX, 
RATIO_Y: em.ratioY, 
UNIT: em(1), 
PADDING: em(1.25), 

FONT_SIZE: em(1), 
FONT_SIZE_SMALLER: em(0.75), 
FONT_SIZE_SMALL: em(0.875), 
FONT_SIZE_TITLE: em(1.25), 

StyleSheet.create只支持样式对象,而不是任何随机属性。

只有在Android中出现错误可能是因为不同版本的JSC之间的实现差异。

+0

谢谢!但是我不明白为什么JSC版本之间存在差异,你能解释一下吗? –

相关问题