From 3b03f87a02458f719e2eb4bf112a13441b427d14 Mon Sep 17 00:00:00 2001
From: ‘chensiAb’ <‘chenchenco03@163.com’>
Date: Tue, 25 Mar 2025 13:54:34 +0800
Subject: [PATCH] Merge branch 'master' of ssh://dev.zhiheiot.com:29418/mob-components
---
_cursor.ai/layout.doc/navCustomBar.doc/CNavCustomBar.doc.md | 80 ++++++++++++++++++++++++++++++++++++++++
1 files changed, 80 insertions(+), 0 deletions(-)
diff --git a/_cursor.ai/layout.doc/navCustomBar.doc/CNavCustomBar.doc.md b/_cursor.ai/layout.doc/navCustomBar.doc/CNavCustomBar.doc.md
new file mode 100644
index 0000000..1c46be4
--- /dev/null
+++ b/_cursor.ai/layout.doc/navCustomBar.doc/CNavCustomBar.doc.md
@@ -0,0 +1,80 @@
+# CNavCustomBar 自定义导航条
+
+## 功能说明
+
+自定义导航条组件，用于在页面顶部显示导航信息，可以自动适配不同设备的状态栏高度，支持显示返回按钮和标题。
+
+## 引用方式
+
+```js
+import CNavCustomBar from '@components/layout/navCustomBar';
+```
+
+## 组件参数
+
+- `isNeedBackIcon` (Boolean，可选)：是否需要显示返回按钮，默认值为 false
+- `title` (String，可选)：导航栏标题文本，默认值为空字符串
+
+## 实例方法
+
+- `$getStatusBarHeight()`：获取状态栏高度
+- `$getNavBarHeight()`：获取导航栏的总高度（包括状态栏）
+
+## 使用示例
+
+### 基础用法
+
+```html
+<template>
+ <view class="page">
+ <CNavCustomBar
+ title="页面标题"
+ :isNeedBackIcon="true"
+ />
+ <view class="content" :style="{paddingTop: navBarHeight + 'px'}">
+ <!-- 页面内容 -->
+ </view>
+ </view>
+</template>
+
+<script>
+import CNavCustomBar from '@components/layout/navCustomBar';
+
+export default {
+ components: {
+ CNavCustomBar
+ },
+ data() {
+ return {
+ navBarHeight: 0
+ }
+ },
+ mounted() {
+ this.navBarHeight = this.$refs.navBar.$getNavBarHeight();
+ }
+}
+</script>
+```
+
+### 自定义图标
+
+```html
+<template>
+ <view class="page">
+ <CNavCustomBar title="首页">
+ <template #icon>
+ <image class="menu-icon" src="../assets/menu.png" />
+ </template>
+ </CNavCustomBar>
+ </view>
+</template>
+```
+
+## 注意事项
+
+1. 组件使用固定定位显示在页面顶部，使用时需要给内容区域设置上内边距，值为导航栏高度，可通过 `$getNavBarHeight()` 方法获取
+2. 组件会自动适配不同设备的状态栏高度
+3. 当 `isNeedBackIcon` 为 true 时，点击返回按钮默认执行 Taro.navigateBack({ delta: 1 })
+4. 可以通过具名插槽 "icon" 自定义左侧图标，但仅在 isNeedBackIcon 为 false 时生效
+
+<!-- 作者：chensi -->
\ No newline at end of file
--
Gitblit v1.9.1