Utils 工具库 - Env 适配布局

适配类

#机型判断

#isIOS

• 判断当前机型是否是IOS

<template>
    <div class="wrapper">
        <text>isIOS: 判断当前机型是否是IOS </text>
    </div>
</template>
<script>
export default {
    data:()=> ({
        name: 'isIOS',
    }),
    methods: {
        clickHandler() {
            //判断当前机型是否是IOS
            let res = this.$util.env.isIOS()
            this.$toast(res)
        }
    }
}
</script>
<style scoped>
.wrapper{
    background-color: #ffffff;
}
</style>  

#isAndroid

• 判断当前机型是否是Android

<template>
    <div class="wrapper">
        <text>isAndroid: 判断当前机型是否是Android </text>
    </div>
</template>
<script>
export default {
    data:()=> ({
        name: 'isAndroid',
    }),
    methods: {
        clickHandler() {
            //判断当前机型是否是Android
            let res = this.$util.env.isAndroid()
            this.$toast(res)
        }
    }
}
</script>
<style scoped>
.wrapper{
    background-color: #ffffff;
}
</style>  

#isWeb

• 判断当前机型是否是web

<template>
    <div class="wrapper">
        <text>isWeb: 判断当前机型是否是web </text>
    </div>
</template>
<script>
export default {
    data:()=> ({
        name: 'isWeb',
    }),
    methods: {
        clickHandler() {
            //判断当前机型是否是web
            let res = this.$util.env.isWeb()
            this.$toast(res)
        }
    }
}
</script>
<style scoped>
.wrapper{
    background-color: #ffffff;
}
</style>  

#isIPhoneX

• 判断当前机型是否是iPhoneX及以上【适配设备底部安全区】

<template>
    <div class="wrapper">
        <text>isIPhoneX: 判断当前机型是否是iPhoneX </text>
    </div>
</template>
<script>
export default {
    data:()=> ({
        name: 'isIPhoneX',
    }),
    methods: {
        clickHandler() {
            //判断当前机型是否是iPhoneX及以上
            let res = this.$util.env.isIPhoneX()
            this.$toast(res)
        }
    }
}
</script>
<style scoped>
.wrapper{
    background-color: #ffffff;
}
</style>  

#isNotch

• 判断当前机型是否是IOS全面屏【适配设备底部安全区】（黑名单方式）

<template>
    <div class="wrapper">
        <text>isNotch: 判断当前机型是否是IOS全面屏 </text>
    </div>
</template>
<script>
export default {
    data:()=> ({
        name: 'isNotch',
    }),
    methods: {
        clickHandler() {
            //判断当前机型是否是iPhoneX及以上
            let res = this.$util.env.isNotch()
            this.$toast(res)
        }
    }
}
</script>
<style scoped>
.wrapper{
    background-color: #ffffff;
}
</style>  

#布局尺寸

#statusBarHeight

• 获取状态栏高度

<template>
    <div class="wrapper">
        <text>statusBarHeight: 获取状态栏高度 </text>
    </div>
</template>
<script>
export default {
    data:()=> ({
        name: 'statusBarHeight',
    }),
    methods: {
        clickHandler() {
            //获取状态栏高度
            let res = this.$util.env.statusBarHeight()
            this.$toast(res)
        }
    }
}
</script>
<style scoped>
.wrapper{
    background-color: #ffffff;
}
</style>  

#screenHeight

• 获取设备屏幕高度

<template>
    <div class="wrapper">
        <text>getScreenHeight: 获取设备屏幕高度 </text>
    </div>
</template>
<script>
export default {
    data:()=> ({
        name: 'getScreenHeight',
    }),
    methods: {
        clickHandler() {
            //获取设备屏幕高度
            let res = this.$util.env.getScreenHeight()
            this.$toast(res)
        }
    }
}
</script>
<style scoped>
.wrapper{
    background-color: #ffffff;
}
</style>  

#便捷工具

#compareVersion 版本比对

• 版本比对

<template>
    <div class="wrapper">
        <text>compareVersion: 版本比对 </text>
    </div>
</template>
<script>
export default {
    data:()=> ({
        name: 'compareVersion',
    }),
    methods: {
        clickHandler() {
            //版本比对
            let target = '7.1.0'
            let source = '7.0.22'
            let res = this.$util.compareVersion(target,source)
            this.$toast(res)
        }
    }
}
</script>
<style scoped>
.wrapper{
    background-color: #ffffff;
}
</style>  

#参数

• 参数详情：

Params	Type	Required	default	Value
targetVer	String	N	0.0.0	目标版本
sourceVer	String	N	0.0.0	参照版本