javascript - 获取 Object.freeze 只能在 Android 上的对象上调用

Question

我得到了 Object.freeze can only be called on Objects(仅在 Android 上)。

经过深入研究，我发现这是因为我在不同的文件夹中引用了我的所有样式，而 Android 对此并不满意。

Github Issue

我的文件夹结构

• 来源

  • 行动
  • 容器
    • Home.js(有样式)
  • 组件
  • 样式
    • 计算大小.js
    • index.js

• App.js

• Router.js(有样式)

如您所见，模拟器开始报错

Router.js: 9

对应

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

长话短说，只有当我在文件中创建本地 StyleSheet 变量来进行样式设置时，问题才会消失，这非常烦人。

有人遇到过这种情况吗？我找不到解决方案:(

这是我的样式索引，也许某些方法呈现为未定义而我不知道

计算大小

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);
}

index.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
      }
    })
  }
})

Answer 1

错误是由于您在 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 之间的实现不同。