Badge
Under Development
The LvBadge component superscripts or subscripts an avatar-like icon or text onto content to highlight information to a user or to just draw attention to a specific element. Content within the badge usually contains numbers or icons.
#Basic
LightVue comes with some stunning designs for badge.There are different types of badge present in lightVue you can go through this page for more info.You can change the color of badge by passing value in color prop. LightVue Badge is Both compatible with Vue 2.x and Vue 3.x
#Setup
You can import a component and register it as a local and global vue component as follows:
// import the component
import LvBadge from 'lightvue/badge';
// Register the component locally
export default {
components: {
LvBadge
}
}// Register the component globally (Vue 2.x)
Vue.component('LvBadge', LvBadge);
// Register the component globally (Vue 3.x)
const app = Vue.createApp({
// ...
});
app.component('LvBadge', LvBadge);
app.mount('#app')
#APIs
All of the props, events and slots of the component are mentioned below:
Props
Type
Default
Description
size
String
md
Configures the size of badge.