el-menu-item右侧设置红点
时间: 2023-04-02 15:01:33 浏览: 199
您可以使用el-badge组件来在el-menu-item右侧设置红点。在el-menu-item中添加el-badge组件,并设置属性is-dot为true即可。例如:
<el-menu-item index="1">
<i class="el-icon-menu"></i>
<span>菜单一</span>
<el-badge is-dot></el-badge>
</el-menu-item>
相关问题
el-menu-item设置el-badge
对于el-menu-item设置el-badge,你可以在el-menu-item标签中添加el-badge组件作为子组件,并通过相应的属性设置徽标的内容和样式,例如:
```html
<el-menu>
<el-menu-item>
菜单项一
<el-badge :value="10"></el-badge>
</el-menu-item>
<el-menu-item>
菜单项二
<el-badge is-dot></el-badge>
</el-menu-item>
</el-menu>
```
在这个示例中,第一个el-menu-item有一个显示值为10的el-badge组件,第二个el-menu-item有一个小圆点徽标。你可以根据自己的需求自定义el-badge组件的样式和显示内容来实现类似的效果。
el-menu-item item
在使用element-ui的`<el-menu>`循环`<el-menu-item>`时,默认不会选中。为了解决这个问题,可以在`<el-menu-item>`的`index`属性上添加一个唯一的值,以确保每个`<el-menu-item>`都有一个独立的索引值。在引用中的问题代码中,`index`属性的取值`(i 1)`是错误的,应该改为`(i + 1)`来生成正确的索引值。如引用所示,应该将`(i + 1)`转换为字符串形式,即`(i + 1).toString()`来作为`index`属性的值。这样就能确保每个`<el-menu-item>`都有一个唯一的索引值,从而实现默认选中的功能。