Checker 组件使用教程
优质
小牛编辑
146浏览
2023-12-01
安装
import { Checker, CheckerItem } from 'vux'
export default {
components: {
Checker,
CheckerItem
}
}// 在入口文件全局引入
import Vue from 'vue'
import { Checker, CheckerItem } from 'vux'
Vue.component('checker', Checker)
Vue.component('checker-item', CheckerItem)
Checker 是比Radio或者Checklist更加灵活的选择组件，可以自定义需要的布局样式。
属性
| 名字 | 类型 | 默认值 | 说明 | 版本要求 |
| default-item-class | string | 默认状态class | -- | |
| selected-item-class | string | 选中样式class | -- | |
| disabled-item-class | string | 不可选样式class | -- | |
| type | string | radio | 类型，单选为radio, 多选为checkbox | -- |
| value | string array | 表单值，使用v-model绑定 | -- | |
| max | number | 最多可选个数，多选时可用 | -- | |
| radio-required | boolean | false | 在单选模式下是否必选一个值。设为 true 后点击当前选中项不会取消选中。 | v2.6.3 |
事件
| 名字 | 参数 | 说明 | 版本要求 |
| @on-change | (value) | value值变化时触发 | -- |
属性
| 名字 | 类型 | 默认值 | 说明 | 版本要求 |
| value | string | 当前项的值 | -- | |
| disabled | boolean | false | 是否为不可选 | -- |
事件
| 名字 | 参数 | 说明 | 版本要求 |
| @on-item-click | (itemValue, itemDisabled) | 当前项被点击时触发 | -- |