docs_vue2/one/docs/demo/checkbox/size.vue

66 lines
1.0 KiB
Vue
Raw Normal View History

2020-08-13 11:47:56 +08:00
<template>
<article>
<section>
<veui-checkbox
v-model="checked"
:ui="size"
:indeterminate.sync="indeterminate"
>
Checked: {{ checked }}
</veui-checkbox>
</section>
<section>
<veui-checkbox
v-model="small"
ui="s"
>
Small
</veui-checkbox>
<veui-checkbox
v-model="indeterminate"
ui="s"
>
Indeterminate
</veui-checkbox>
</section>
</article>
</template>
<script>
import { Checkbox } from 'veui'
export default {
components: {
'veui-checkbox': Checkbox
},
data () {
return {
checked: false,
indeterminate: false,
small: false
}
},
computed: {
size () {
return this.small ? 's' : ''
}
}
}
</script>
2021-09-15 20:03:51 +08:00
<style lang="less" scoped>
.veui-checkbox {
& + & {
margin-left: 20px;
}
}
2020-08-13 11:47:56 +08:00
</style>
<docs>
可以使用 `indeterminate` 属性来设置半选状态
</docs>
<docs locale="en-US">
Use the `indeterminate` prop to put the checkbox in indeterminate state.
</docs>