vue实现消息badge 标记_Badge 标记

Badge 标记

Badge 标记

出现在按钮、图标旁的数字或状态标记。

基础用法

定义value属性，它接受Number或者String。

评论

回复

点我查看

评论

回复

.item {

margin-top: 10px;

margin-right: 40px;

}

最大值

可自定义最大值。

由max属性定义，它接受一个Number，需要注意的是，只有当value为Number时，它才会生效。

评论

回复

.item {

margin-top: 10px;

margin-right: 40px;

}

自定义内容

可以显示数字以外的文本内容。

定义value为String类型是时可以用于显示自定义文本。

评论

回复

.item {

margin-top: 10px;

margin-right: 40px;

}

小红点

以红点的形式标注需要关注的内容。

除了数字外，设置is-dot属性，它接受一个Boolean。

数据查询

.item {

margin-top: 10px;

margin-right: 40px;

}

Attributes

参数

说明

类型

可选值

默认值

value

显示值

string, number

—

—

max

最大值，超过最大值会显示 '{max}+'，要求 value 是 Number 类型

number

—

—

is-dot

小圆点

boolean

—

false

hidden

隐藏 badge

boolean

—

false