client-app/components/hc-sys/index.vue

<template>
    <view class="hc-sys-box" :class="[tabbar ? 'is-tabbar' : '', ui]">
        <hc-nav-bar id="hc-nav-bar" :ui="navBarUi" v-if="isNavBars">
            <slot name="navBar"></slot>
        </hc-nav-bar>
        <slot></slot>
        <hc-tabbar v-if="tabbar"/>
    </view>
</template>

<script setup>
import {ref, watch} from "vue";

const props = defineProps({
    ui: String,
    tabbar: Boolean,
    navBarUi: String,
    isNavBar: {
        type: Boolean,
        default: true
    }
});

const isNavBars = ref(props.isNavBar)
//监听
watch(() => [
    props.isNavBar,
], ([val]) => {
    isNavBars.value = val
})

</script>

<style scoped lang="scss">
@import "./style.scss";
</style>