Checkbox 复选框 APP
该方法或组件支持移动端小程序调用

PC
该方法或组件支持桌面端小程序调用

引入方式

数字生活小程序工程中，不需要 import，直接使用组件标签即可。

import {OkCheckbox} from '@21cnfe/vui'  
Vue.component('OkCheckbox', OkCheckbox)

代码演示

Checkbox 复选框 checkboxes

基本用法

<ok-checkbox :checked="checkValue"></ok-checkbox>

禁用状态

<ok-checkbox :checked="checkValue" disabled></ok-checkbox>

自定义样式通过 checkStyle 和 activeStyle 分别设置未选中及选中状态样式

<ok-checkbox :checked="checkValue" :checkStyle="checkStyle" :activeStyle="activeStyle"></ok-checkbox>
<script>
  export default {
    data () {
      return {
        checkValue: true,
        checkStyle: {
          'background-image': 'url(' + require('../assets/nochecked.png') + ')'
        },
        activeStyle: {
          'background-image': 'url(' + require('../assets/checked.png') + ')'
        }
      }
    }
  }
</script>

API

属性	说明	类型	默认值
`checked`	指定当前是否选中	Boolean	`false`
`disabled`	指定当前是否禁用	Boolean	`--`
`activeStyle`	复选框选中时的自定义样式	Object	`--`
`checkStyle`	复选框未选中的自定义样式	Object	`--`

Event

事件名称	说明	回调参数
`onChange`	复选框操作事件	`checkStatus`当前是否选中状态

1. Checkbox 复选框 APP 该方法或组件支持移动端小程序调用 PC 该方法或组件支持桌面端小程序调用

Checkbox 复选框 APP 该方法或组件支持移动端小程序调用 PC 该方法或组件支持桌面端小程序调用

引入方式

代码演示

API

Event

Checkbox 复选框 APP
该方法或组件支持移动端小程序调用

PC
该方法或组件支持桌面端小程序调用