复选框 KLCheck

基本形式

<kl-check name="多选按钮" checked={isChecked} on-check={console.log($event)} on-change={console.log($event)}/>
<div>checked: {isChecked}</div>

在表单中使用

<kl-form>
    <kl-form-item title="通知方式" tip="通知方式">
            <kl-check name="邮件" checked={isEmail}/>
            <kl-check name="短信" checked={isMsg}/>
    </kl-form-item>
</kl-form>
<div>通知方式：{#if isEmail} 邮件 {/if} {#if isMsg} 短信 {/if} </div>

半选状态

<kl-check name="半选状态" checked={isChecked} />
<div>checked： {isChecked}</div>

var component = new NEKUI.Component({
    template: template,
    data: {
        isChecked: null
    }
});

多行

<kl-check name="邮件" block />
<kl-check name="短信" block />

禁用组件

<kl-check name="禁用多选按钮" disabled />

插入模版

<kl-check name="多选按钮" checked={isChecked} on-check={console.log($event)} on-change={console.log($event)}>
    <kl-input class="kl-template"  />
</kl-check>
<div>checked: {isChecked}</div>

API

KLCheck

Param	Type	Default	Description
options.data	`object`		= 绑定属性
[options.data.name]	`string`		=> 多选按钮的文字
[options.data.checked]	`boolean`	`false`	<=> 多选按钮的选择状态。`false`表示未选，`true`表示已选，`null`表示半选。
[options.data.block]	`boolean`	`false`	=> 是否以block方式显示
[options.data.readonly]	`boolean`	`false`	=> 是否只读
[options.data.disabled]	`boolean`	`false`	=> 是否禁用
[options.data.visible]	`boolean`	`true`	=> 是否显示
[options.data.class]	`string`		=> 补充class
[options.data.contentTemplate]	`string`		=> 内容模板，用于支持复杂内容的自定义。

change 选中状态改变时触发Event

Name	Type	Description
sender	`object`	事件发送对象
date	`object`	改变后的选中状态

check 改变选中状态时触发Event

Name	Type	Description
sender	`object`	事件发送对象
checked	`boolean`	选中状态