docs_vue2/one/docs/demo/button-group/disabled.vue

77 lines
1.5 KiB
Vue
Raw Normal View History

2020-08-13 11:47:56 +08:00
<template>
<article>
<section>
<veui-checkbox v-model="disabled">
Disabled
</veui-checkbox>
</section>
<section>
<veui-button-group
ui="primary"
:disabled="disabled"
>
<veui-button :disabled="disabled">
Undo
</veui-button>
<veui-button :disabled="disabled">
Redo
</veui-button>
</veui-button-group>
</section>
<section>
<veui-button-group
:items="group"
:disabled="disabled"
/>
</section>
<section>
<veui-button-group
ui="strong"
:items="group"
:disabled="disabled"
/>
</section>
</article>
</template>
<script>
import { Button, ButtonGroup, Checkbox } from 'veui'
export default {
components: {
'veui-button': Button,
'veui-button-group': ButtonGroup,
'veui-checkbox': Checkbox
},
data () {
return {
disabled: true,
group: [
{
label: 'Undo',
value: 'undo'
},
{
label: 'Redo',
value: 'redo'
}
]
}
}
}
</script>
2021-09-15 20:03:51 +08:00
<style lang="less" scoped>
2020-08-13 11:47:56 +08:00
section {
margin-bottom: 1em;
}
</style>
<docs>
`ButtonGroup` `disabled` 属性仅在使用 `items` 指定内容时生效如果使用内联的 `Button` 组件则需要为每个按钮分别指定 `disabled` 属性
</docs>
<docs locale="en-US">
When given a string `value` property on an item, clicking the corresponding button will emit an event with the same name on `ButtonGroup`.
</docs>