Files
uniapp-im-shop/components/nav-bar/nav-bar.vue

50 lines
870 B
Vue

<script setup>
import { navigateBack } from '@/utils/router'
const props = defineProps({
})
const onBack = () => {
navigateBack()
}
</script>
<template>
<view class="nav-bar">
<view class="status_bar">
<!-- 这里是状态栏 -->
</view>
<view class="nav-bar-box">
<!-- 左侧插槽 -->
<view @click="onBack">
<slot name="back"></slot>
</view>
<!-- 右侧插槽 -->
<view>
<slot name="right"></slot>
</view>
</view>
</view>
</template>
<style lang="scss" scoped>
.nav-bar {
position: fixed;
top: 0;
width: 100%;
z-index: 99;
}
.status_bar {
height: var(--status-bar-height);
width: 100%;
}
.nav-bar-box {
padding: 0 36rpx;
height: 44px;
display: flex;
align-items: center;
justify-content: space-between;
}
</style>