49fa8c4509
在关于页面添加自定义导航栏组件 fg-navbar，并配置 pages.config.ts 实现自动导入 新增 fg-navbar 组件，基于 wd-navbar 封装，提供统一的导航栏样式和返回逻辑 ``` 这个提交消息： 1. 使用 feat 类型，因为是新增功能 2. 添加了 scope (about) 表示主要修改的是关于页面 3. 描述部分简洁说明了"添加自定义导航栏组件"这个主要变更和"配置自动导入"这个配套修改 4. 在正文中补充说明了新增组件的实现细节和目的
49 lines
1.0 KiB
Vue
49 lines
1.0 KiB
Vue
<script lang="ts" setup>
|
|
withDefaults(defineProps<{
|
|
leftText?: string;
|
|
rightText?: string;
|
|
leftArrow?: boolean;
|
|
bordered?: boolean;
|
|
fixed?: boolean;
|
|
placeholder?: boolean;
|
|
zIndex?: number;
|
|
safeAreaInsetTop?: boolean;
|
|
leftDisabled?: boolean;
|
|
rightDisabled?: boolean;
|
|
}>(), {
|
|
leftText: '返回',
|
|
rightText: '',
|
|
leftArrow: true,
|
|
bordered: true,
|
|
fixed: false,
|
|
placeholder: true,
|
|
zIndex: 1,
|
|
safeAreaInsetTop: true,
|
|
leftDisabled: false,
|
|
rightDisabled: false,
|
|
});
|
|
|
|
function handleClickLeft() {
|
|
uni.navigateBack({
|
|
fail() {
|
|
uni.reLaunch({
|
|
url: '/pages/index/index',
|
|
});
|
|
},
|
|
});
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<wd-navbar
|
|
:left-text="leftText" :right-text="rightText" :left-arrow="leftArrow"
|
|
:bordered="bordered" :fixed="fixed" :placeholder="placeholder" :z-index="zIndex"
|
|
:safe-area-inset-top="safeAreaInsetTop" :left-disabled="leftDisabled" :right-disabled="rightDisabled"
|
|
@click-left="handleClickLeft"
|
|
>
|
|
<template #title>
|
|
<slot />
|
|
</template>
|
|
</wd-navbar>
|
|
</template>
|