uniapp笔记之数字角标uni-badge使用

作者：小蓝xlanll | 2024-04-28 17:06:15

踩

uni-badge

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

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/小蓝xlanll/article/detail/503380