Ant Design Vue Checkbox多选框属性事件列表

Checkbox 属性

属性名称	描述	类型	默认值
autoFocus	自动获取焦点	boolean	false
checked	是否选中	boolean	false
defaultChecked	初始是否选中	boolean	false
disabled	是否禁用	boolean	false
indeterminate	设置 indeterminate 状态，只负责样式控制	boolean	false

Checkbox事件

事件名称	描述	回调参数
change	当选中或取消选中时的事件	Function(e)

Checkbox Group多选框组属性

属性名称	描述	类型	默认值
defaultValue	默认选中项	string[]	[]
disabled	是否禁用复选框组	boolean	false
name	复选框组下所有 input[type="checkbox"] 的 name 版本1.5.0+	string	-
options	指定可选项，可以通过 slot="label" slot-scope="option" 定制label 详情请点击查看	string[]或者 [{ label: string, value: string , disabled?: boolean, indeterminate?: boolean, onChange?: function }]	[]
value	指定选中的选项	string[]	[]

Checkbox Group多选框组事件

事件名称	描述	回调参数
change	当选中或取消选中时的事件	Function(e)

Checkbox 方法

事件名称	描述
blur()	移除焦点
focus()	获取焦点

<!--focus()方法例子-->
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>focus方法例子</title>
    <script src="https://www.itxst.com/package/vue/vue.min.js"></script>
    <script src="https://www.itxst.com/package/ant-design-vue/antd.min.js"></script>
    <link href="https://www.itxst.com/package/ant-design-vue/antd.min.css" rel="stylesheet" />
    <style>
        body {
            padding-top: 10px
        }
    </style>
</head>
<body>
    <div id="app">
        <a-button type="primary" @click="jd">获取焦点</a-button>
        <br />
        <a-checkbox ref="ck" @change="onChange">多选框</a-checkbox>
    </div>
    <script>
        var app = new Vue({
            el: '#app',
            data: {
            },
            methods: {
                onChange(e) {
                    alert(e.target.checked)
                },
                //调用focus()方法 *************************
                jd() {
                    this.$refs.ck.focus();
                }
            },
        });
    </script>
</body>
</html>