zyejMAll-mobile/sheep/ui/su-status-bar/su-status-bar.vue

30 lines
620 B
Vue
Raw Normal View History

2024-08-07 10:31:42 +08:00
<!-- 自定义状态栏 -->
<template>
2024-10-21 17:47:58 +08:00
<view :style="{ height: statusBarHeight,background: navbarbackgroundColor }" class="uni-status-bar" :class="navBg? 'ss' : ''" >
2024-10-11 16:07:43 +08:00
<slot />
</view>
2024-08-07 10:31:42 +08:00
</template>
<script setup>
2024-10-11 16:07:43 +08:00
import sheep from '@/sheep';
const props = defineProps({
navBg: {
type: Boolean,
default: false,
2024-10-21 17:47:58 +08:00
},
navbarbackgroundColor:{
type: String,
default: '',
2024-10-11 16:07:43 +08:00
}
})
const statusBarHeight = sheep.$platform.device.statusBarHeight - 2 + 'px';
2024-08-07 10:31:42 +08:00
</script>
<style lang="scss">
2024-10-11 16:07:43 +08:00
.uni-status-bar {
// width: 750rpx;
height: var(--status-bar-height);
}
.ss {
background: #e93422;
2024-10-11 16:07:43 +08:00
}
</style>