feat(about): 添加自定义导航栏组件并配置自动导入
在关于页面添加自定义导航栏组件 fg-navbar,并配置 pages.config.ts 实现自动导入 新增 fg-navbar 组件,基于 wd-navbar 封装,提供统一的导航栏样式和返回逻辑 ``` 这个提交消息: 1. 使用 feat 类型,因为是新增功能 2. 添加了 scope (about) 表示主要修改的是关于页面 3. 描述部分简洁说明了"添加自定义导航栏组件"这个主要变更和"配置自动导入"这个配套修改 4. 在正文中补充说明了新增组件的实现细节和目的
This commit is contained in:
parent
ef7c1fd389
commit
49fa8c4509
@ -11,6 +11,7 @@ export default defineUniPages({
|
|||||||
easycom: {
|
easycom: {
|
||||||
autoscan: true,
|
autoscan: true,
|
||||||
custom: {
|
custom: {
|
||||||
|
'^fg-(.*)': '@/components/fg-$1/fg-$1.vue',
|
||||||
'^wd-(.*)': 'wot-design-uni/components/wd-$1/wd-$1.vue',
|
'^wd-(.*)': 'wot-design-uni/components/wd-$1/wd-$1.vue',
|
||||||
'^(?!z-paging-refresh|z-paging-load-more)z-paging(.*)':
|
'^(?!z-paging-refresh|z-paging-load-more)z-paging(.*)':
|
||||||
'z-paging/components/z-paging$1/z-paging$1.vue',
|
'z-paging/components/z-paging$1/z-paging$1.vue',
|
||||||
|
48
src/components/fg-navbar/fg-navbar.vue
Normal file
48
src/components/fg-navbar/fg-navbar.vue
Normal file
@ -0,0 +1,48 @@
|
|||||||
|
<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>
|
@ -11,6 +11,7 @@
|
|||||||
class="bg-white overflow-hidden pt-2 px-4"
|
class="bg-white overflow-hidden pt-2 px-4"
|
||||||
:style="{ marginTop: safeAreaInsets?.top + 'px' }"
|
:style="{ marginTop: safeAreaInsets?.top + 'px' }"
|
||||||
>
|
>
|
||||||
|
<fg-navbar>关于</fg-navbar>
|
||||||
<view class="text-center text-3xl mt-8">
|
<view class="text-center text-3xl mt-8">
|
||||||
鸽友们好,我是
|
鸽友们好,我是
|
||||||
<text class="text-red-500">菲鸽</text>
|
<text class="text-red-500">菲鸽</text>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user