平台兼容性

NoticeBar 通知栏

通知栏组件,组件名:cmd-notice-bar,代码块: cmdNoticeBar。

使用方式:

script 中引用组件

import cmdNoticeBar from "@/components/cmd-notice-bar/cmd-notice-bar.vue"
export default {
    components: {cmdNoticeBar}
}

单行多行

<cmd-notice-bar text="为了确保您的资金安全,请设置支付密码"></cmd-notice-bar>
<cmd-notice-bar rows text="为了确保您的资金安全,请设置支付密码。为了确保您的资金安全,请设置支付密码。为了确保您的资金安全,请设置支付密码."></cmd-notice-bar>

文字滚动

<cmd-notice-bar scrollable text="为了确保您的资金安全,请设置支付密码。为了确保您的资金安全,请设置支付密码。为了确保您的资金安全,请设置支付密码."></cmd-notice-bar>   

显示图标、情景色、圆角

<cmd-notice-bar text="为了确保您的资金安全,请设置支付密码" type="activity" icon="alert-circle"></cmd-notice-bar>
<cmd-notice-bar text="为了确保您的资金安全,请设置支付密码" type="warning" mode="link"></cmd-notice-bar>
<cmd-notice-bar text="为了确保您的资金安全,请设置支付密码" :round="true" mode="closable"></cmd-notice-bar>

自动关闭

<cmd-notice-bar :time="5000" icon="alert-circle" scrollable text="为了确保您的资金安全,请设置支付密码。为了确保您的资金安全,请设置支付密码。为了确保您的资金安全,请设置支付密码."></cmd-notice-bar>

属性说明:

属性名 类型 默认值 说明
text String - 显示文字
mode String - 右侧提示类型 close/link
type String default 情景类型 default/activity/warning
time String Number 显示时长 单位为ms,不需要自动消失可将其置为0
round Boolean false 圆角显示
rows Boolean false 多行文本显示
scrollable Boolean false 是否滚动,为true时,NoticeBar为单行
icon String - 左侧状态图标
make Object - 通知栏自定义样式

事件说明:

事件名称 说明
click 点击 通知文本 触发事件
close 点击 关闭x 触发事件
link 点击 更多> 触发事件

隐私、权限声明

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

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

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

许可协议

MIT协议

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