React Native 全局变量的使用

1,800 阅读1分钟

React Native 全局变量的使用

1.新建一个文件,此处命名为global.js,代码如下

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

const {width, height} = Dimensions.get('window');
const  OS = Platform.OS;
const ios = (OS == 'ios');
const android = (OS == 'android');
const  isIPhoneX = (ios && height == 812 && width == 375);
const  statusBarHeight = (ios ? (isIPhoneX ? 44 : 20) : StatusBar.currentHeight);


global.gScreen = {
    screen_width:width,
    screen_height:height,
    statusBarHeight:statusBarHeight,
    onePixelRatio:1/PixelRatio.get(),
}

global.gDevice = {
    ios:ios,
    android:android,
    isIPhoneX:isIPhoneX,
}

2.在项目入口处导入

//该全局文件的倒入只需一次,且需要在其他文件声明之前
import Global from './Pages/Common/global';

3.全局变量的调用

const styles = StyleSheet.create({
    container: {
        backgroundColor: "#F5F5F5",
        flex:1
    },
    box: {
# width:gScreen.screen_width
# // width: '90%',
        margin: 10,
    },
  

});