naive-ui/demo/documentation/components/badge/enUS/raw.demo.md
2020-10-21 17:10:23 +08:00

35 lines
709 B
Markdown

# Raw
```html
<n-space :size="24" align="center">
<n-badge :value="value" :max="15" />
<n-badge :value="value" dot/>
<n-button-group>
<n-button @click="value = Math.min(16, value + 1)">
<template v-slot:icon>
<n-icon><md-add /></n-icon>
</template>
</n-button>
<n-button @click="value = Math.max(0, value - 1)">
<template v-slot:icon>
<n-icon><md-remove /></n-icon>
</template>
</n-button>
</n-button-group>
</n-space>
```
```js
import mdAdd from 'naive-ui/lib/icons/md-add'
import mdRemove from 'naive-ui/lib/icons/md-remove'
export default {
components: {
mdAdd,
mdRemove
},
data () {
return {
value: 5
}
}
}
```