React Native 全局变量的使用

2018-07-03  本文已影响1841人  云深不知处a

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,
    },
  

});

到此整个项目都可以使用Global中定义好的参数,如有问题请留言

上一篇下一篇

猜你喜欢

热点阅读