@beisen-cmps/ux-checkbox-new

新版平铺单选、多选组件，此组件兼容 react15 和 16

参数，详情请看 interface 定义

参数	说明	默认值	类型	是否必填
multiple	是否是多选	false-->单选	boolean	非必填
onChange	选择的change事件	无默认	(val: ICheckboxItem[] | ICheckboxItem | null) => void 多选的时候返回的是ICheckboxItem[]，单选的时候是ICheckboxItem	非必填
data	初始化源数据	无默认	ICheckboxItem[]	必填
wraperClass	包裹classname	无默认	string	非必填

// 关于文本输入框的一些配置参数
interface ICheckboxItem {
	value: number | string //显示的value
	text: string //显示的文本
	isChecked?: boolean //是否选中
}

调用示范

import * as React from 'react'
import NewCheckbox from '../../src'
export default class extends React.Component<any, any> {
	constructor(props) {
		super(props)
	}
	handleChange(value) {
		console.log(value)
	}
	render(): JSX.Element {
		const newProps = {
			multiple: false,
			onChange: this.handleChange,
			data: [
				{
					value: '1',
					text: '文本1',
					isChecked: false
				},
				{
					value: '2',
					text: '文本文本1',
					isChecked: false
				},
				{
					value: '3',
					text: '文本文本本',
					isChecked: false
				},
				{
					value: '4',
					text: '问问aaasad',
					isChecked: false
				},
				{
					value: '5',
					text: '问问aaaaasad',
					isChecked: false
				},
				{
					value: '6',
					text: '我问问任务分为服务阿达萨达萨达说萨达萨达大声点',
					isChecked: false
				},
				{
					value: '7',
					text: '文本1',
					isChecked: false
				},
				{
					value: '8',
					text: '文本1',
					isChecked: false
				},
				{
					value: '9',
					text: '文本1',
					isChecked: false
				}
			],
			wraperClass: 'test2'
		}
		const otherProps = {
			multiple: true,
			onChange: this.handleChange,
			wraperClass: 'test',
			data: [
				{
					value: '1',
					text: '文本1',
					isChecked: false
				},
				{
					value: '2',
					text: '文本文本1',
					isChecked: false
				},
				{
					value: '3',
					text: '文本文本本',
					isChecked: false
				},
				{
					value: '4',
					text: '问问aaasad',
					isChecked: false
				},
				{
					value: '5',
					text: '问问aaaaasad',
					isChecked: false
				},
				{
					value: '6',
					text: '我问问任务分为服务阿达萨达萨达说萨达萨达大声点',
					isChecked: false
				},
				{
					value: '7',
					text: '文本1',
					isChecked: false
				},
				{
					value: '8',
					text: '文本1',
					isChecked: false
				},
				{
					value: '9',
					text: '文本1',
					isChecked: false
				}
			]
		}
		return (
			<div style={{ width: '320px' }}>
				<h3>====单选====</h3>
				<NewCheckbox {...newProps} />
				<br />
				<h3>====多选====</h3>
				<NewCheckbox {...otherProps} />
			</div>
		)
	}
}