更新记录

1.0.0(2020-10-19)

发布自定义导航栏、带搜索框、可自定义


自定义导航栏、带搜索框、可自定义


示例代码

<template>
    <view class="container">
        <luo-nav-bar leftIcon='back'></luo-nav-bar>
    </view>
</template>

    import luoNavBar from '@/components/luo-navBar/luo-navBar.vue';
    export default {
        data() {
            return {

            }
        },
        components:{
            luoNavBar
        },
        onLoad() {

        },
        methods: {

        }
    }

注意事项

  1. isSearch搜索框设置为true时,midText应设为空

使用说明

名称 类型 默认值 描述
boxBackColor String #FFFFFF 背景颜色
color String #333333 文字及图标颜色
isBlod Boolean true 标题是否加粗
fixed Boolean false 是否固定顶部
setLinDown String - 设置下边框,格式'2rpx solid #E6E6E6'
leftIcon String - 左侧按钮图标(图标类型参考 Icon 图标 type 属性)
lrightIcon String - 右侧按钮图标(图标类型参考 Icon 图标 type 属性)
leftIconSize Number 24 左侧图标大小
rightIconSize Number 24 右侧图标大小
leftText String - 左侧按钮文本
rightText String - 右侧按钮文本
midText String - 标题文本
isSearch Boolean false 搜索框

插槽说明

  • 可以自定义插入想要的内容,以达到自定义
名称 描述
left 导航栏左边插入
right 导航栏右边插入
mid 导航栏中间插入

示例代码

<luo-nav-bar>
    <view slot="left">left</view>
    <view slot="mid">mid</view>
    <view slot="right">right</view>
</luo-nav-bar>

事件

名称 描述 返回值
@leftClick 左侧按钮点击时触发 -
@rightClick 右侧按钮点击时触发 -
@input 当为默认搜索框时才有, 当键盘输入时,触发input事件,event.detail = {value} 第二个值为输入框值
@focus 当为默认搜索框时才有, 输入框聚焦时触发,event.detail = { value, height },height 为键盘高度 第二个值为输入框值
@blur 当为默认搜索框时才有, 输入框失去焦点时触发,event.detail = {value: value} 第二个值为输入框值
@confirm 当为默认搜索框时才有, 点击完成按钮时触发,event.detail = {value: value} 第二个值为输入框值

隐私、权限声明

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

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

插件不采集任何数据

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

许可协议

MIT协议

暂无用户评论。

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