62 lines
967 B
Vue
62 lines
967 B
Vue
|
<template>
|
|||
|
|
<article>
|
|||
|
|
<veui-badge
|
|||
|
|
:value="count"
|
|||
|
|
:max="100"
|
|||
|
|
>
|
|||
|
|
<veui-button
|
|||
|
|
ui="primary"
|
|||
|
|
@click="inc"
|
|||
|
|
>
|
|||
|
|
Add
|
|||
|
|
</veui-button>
|
|||
|
|
</veui-badge>
|
|||
|
|
<veui-button
|
|||
|
|
ui="s"
|
|||
|
|
@click="reset"
|
|||
|
|
>
|
|||
|
|
Reset
|
|||
|
|
</veui-button>
|
|||
|
|
</article>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import { Badge, Button } from 'veui'
|
|||
|
|
|
|||
|
|
const initial = 96
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
components: {
|
|||
|
|
'veui-badge': Badge,
|
|||
|
|
'veui-button': Button
|
|||
|
|
},
|
|||
|
|
data () {
|
|||
|
|
return {
|
|||
|
|
count: initial
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
inc () {
|
|||
|
|
this.count++
|
|||
|
|
},
|
|||
|
|
reset () {
|
|||
|
|
this.count = initial
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="less" scoped docs>
|
|||
|
|
.veui-badge {
|
|||
|
|
margin-right: 2em;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
|
|||
|
|
<docs>
|
|||
|
|
可以使用 `max` 属性，指定可现实数字的最大值，超过则显示为“<var>max</var>+”。
|
|||
|
|
</docs>
|
|||
|
|
|
|||
|
|
<docs locale="en-US">
|
|||
|
|
Use the `max` prop to specify the max value can be displayed. Displays “<var>max</var>+” when value is larger than `max`.
|
|||
|
|
</docs>
|