更新记录

2.3.0（2023-10-26）

兼容vue2,vue3

增加可选参数: effect--背景高斯模糊

2.2.5（2023-07-13）

增加微信小程序端判断

2.2.4（2022-09-05）

字段名更正: fiexdHolder => fixedHolder; fixedHolder判断字段名同时更正

平台兼容性

zero-custom-bar

插件说明

个人仅测试于微信小程序，一个功能完善的自适应头部导航栏组件

使用方法

<template>
    <view class="container">
    <!-- 用于首页等，无需返回按钮 -->
        <zero-custom-bar title='zerojs的小程序'></zero-custom-bar>

    <!-- 用于二级页面等，需要按钮 -->
        <zero-custom-bar title='zerojs的小程序' :singleIcon="true"></zero-custom-bar>   
        <!-- 或 -->
        <zero-custom-bar title='zerojs的小程序' :zeroCapsule="true" @clickCustom='handleHome'></zero-custom-bar>

        <!-- slot用法 (vue2)-->
        <zero-custom-bar>
        <view slot='left'>
            left
        </view>
        </zero-custom-bar>

        <!-- slot用法 (vue3)-->
        <template v-slot:left>
           <view class="left">left</view>
        </template>
    </view>
</template>
<script>
    export default {
        data() {
            return {
            }
        },
        created() {
        },
        methods: {
            handleHome() {
                uni.showToast({
                    title: '点击了首页',
                    duration: 2000
                });
            }
        },
    }
</script>
    <style lang="scss" scoped>
    </style>

参数说明

slot说明

event说明

插件预览:

小程序搜索: zerojs零技术

预览的小程序不一定能及时更新当前插件