vue 劉海屏兼容組件

/* 無返回按鈕的標頭 */

<template>

  <div v-if="GLOBAL.evnType === GLOBAL.ENV_TYPES.APP_IOS || GLOBAL.evnType === GLOBAL.ENV_TYPES.APP_ANDROID" class='stateBox' :class="{'ios-head':(GLOBAL.evnType === GLOBAL.ENV_TYPES.APP_IOS)}"></div>

</template>

<script>

// 用於兼容 某些安卓機的 頂部安全區寫法不支持 

export default {

  name: 'stateBox'

}

</script>

<style lang="stylus" scoped>

    .stateBox

      width 100%

      height 0.2rem

    .ios-head

      height constant(safe-area-inset-top)

      height env(safe-area-inset-top)

</style>