更新记录

1.0.1(2025-07-01) 下载此版本

更新一下

1.0.0(2025-07-01) 下载此版本

导航栏从悬浮到吸顶


平台兼容性

uni-app

Vue2 Vue3 Chrome Safari app-vue app-nvue Android iOS 鸿蒙
- - - - - - - -
微信小程序 支付宝小程序 抖音小程序 百度小程序 快手小程序 京东小程序 鸿蒙元服务 QQ小程序 飞书小程序 快应用-华为 快应用-联盟
- - - - - - - - - - -

try-headerTop

本插件是头部导航的滚动吸顶

这个可以是一个轮播图等展示内容,只要确定好高度就行

        <view style="height: 350rpx;padding-top: 200rpx;">
头部内容
</view>

头部导航是左边一个图片或者view文字右边一个输入框组成,输入框可以根据位置调节宽度

背景颜色可以根据需要自行修改

在pages.json中把用导航吸顶的页面的原生导航去掉,

            "path": "pages/index/index",
            "style": {
                "navigationBarTitleText": "uni-app",
                "enablePullDownRefresh": true,
                "navigationStyle": "custom"
            }
        }

使用说明

<template>
    <view class="content">
        <headerTop ref="headerTop"></headerTop>
    </view>
</template>
<script>
import headerTop from '../../uni_modules/try-headertop/components/try-headertop/try-headertop.vue'
export default {
        components: {
            headerTop
        },
        onPageScroll(e) {
                    this.$refs.headerTop && this.$refs.headerTop.handlePageScroll(e)
                },
    }
</script>

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

插件不采集任何数据

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

暂无用户评论。

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问