美文网首页
React Native 全局变量的使用

React Native 全局变量的使用

作者: 云深不知处a | 来源:发表于2018-07-03 15:53 被阅读1841次

    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中定义好的参数,如有问题请留言

    相关文章

      网友评论

          本文标题:React Native 全局变量的使用

          本文链接:https://www.haomeiwen.com/subject/zmqjuftx.html