MUI-badge数字角标的基本使用

badge（数字角标）

数字角标一般和其它控件（列表、9宫格、选项卡等）配合使用，用于进行数量提示。 角标的核心类是.mui-badge，默认为实心灰色背景；同时，mui还内置了蓝色（blue）、绿色(green)、黄色(yellow)、红色(red)、紫色(purple)五种色系的数字角标，如下：

1
12
123
3
45
456

代码如下所示：

	
		
		
		
		
		
		
		
		
		
		
	

	
		

			
			
badge（数字角标）
		
		

			

				
有底色
				1
				12
				123
				3
				45
				456
				
无底色（使用父元素背景色）
				1
				2
				3
				4
				5
				6
			
		
	
	
	

下面我们看看真实的效果是怎样的？

这个在做项目的时候其实经常用到，角标使用起来比较方便。具体逻辑也比较简单。这里不再做详细的解释了，。