uniapp笔记之数字角标uni-badge使用
Uniapp官方demo提供数字角标库,可直接使用。1、关于角标显示问题,最常见的应用就是未读消息显示,当未读消息为0时,在text元素中的值置为0,角标依然存在,且显示为0。经过尝试,在uni-badge不能使用display hidden来隐藏元素。需要使用以下构造来实现角标隐藏。<view v-if="show" class="grid-dot"><uni-badgetex
·
Uniapp官方demo提供数字角标库,可直接使用。
1、关于角标显示问题,最常见的应用就是未读消息显示,当未读消息为0时,在text元素中的值置为0,角标依然存在,且显示为0。经过尝试,在uni-badge不能使用display hidden来隐藏元素。需要使用以下构造来实现角标隐藏。
<view v-if="show" class="grid-dot">
<uni-badge text="1" type="error" />
</view>
当show为true显示,为false隐藏。
2、角标数值 赋值给text
更多推荐
已为社区贡献1条内容
所有评论(0)