更新记录

0.0.1（2019-11-02）

根据 NavBar 导航栏(https://ext.dcloud.net.cn/plugin?id=52)自己写的一个导航栏，可适配刘海屏，目前自己测试了微信小程序，HTML5和Android，其他的未测，欢迎指出问题

平台兼容性

ZolysoftNavBar 导航栏

导航栏组件，主要用于头部导航，自动适配刘海屏，组件名：zolysoft-nav-bar

本插件根据 《NavBar 导航栏》 重写，用法与 《NavBar 导航栏》基本相同，不过此插件加入了刘海屏适配 《NavBar 导航栏》插件地址：

    https://ext.dcloud.net.cn/plugin?id=52

使用方式：

在 script 中引用组件

import zolysoftNavBar from "@/components/zolysoft-nav-bar/zolysoft-nav-bar.vue"

export default {
    components: {
        zolysoftNavBar
    }
}

在 template 中使用组件

<zolysoft-nav-bar 
    left-icon="back" 
    left-text="返回" 
    right-text="菜单" 
    title="导航栏组件"
    @click-left="toUpPage"
    @click-right="showMenu" >
</zolysoft-nav-bar>

NavBar 属性说明：

事件说明：

事件名称 说明 click-left 左侧按钮点击时触发 click-right 右侧按钮点击时触发

注：当left-icon为back时，默认给的事件为返回上一页，无需添加click-left

特殊说明

1. 本插件图标依赖于uni-icons，没有的请自行下载 插件地址

   https://ext.dcloud.net.cn/plugin?id=28

2. 有的页面需要用到下拉刷新时，刷新图标会显示到状态栏上，影响显示效果，建议做一下修改： 在App.vue的Style中添加一下代码：

   /*每个页面公共css */
   uni-page-refresh{
       margin-top: 30px;
   }
   uni-page-refresh .uni-page-refresh{
       z-index: 0;
   }