react-beautiful-checkbox

react-beautiful-checkbox

• Created By ancf - (博客地址)[https://kafeihaoka.github.io/myBlog.html#/welcome]

• react-beautiful-checkbox 为一款基于react实现的多选框组件。

DEMO示例地址：https://kafeihaoka.github.io/react-beautiful-checkbox/

安装依赖

npm i react-beautiful-checkbox -S

API 介绍

Property	Description	Type	Default
options	数据列表	array	[]
defaultValue	当前选中项	array	[]
onChange	点击事件	function(e){}	-

用法示例

import Checkbox from "react-beautiful-checkbox";

class RadioDemo extends React.Component {
    state = {
        tabValue : [],
        data: [{
          value: 'apple',
          label: '苹果',
        },{
          value: 'banana',
          label: '香蕉',
        },{
          value: 'pear',
          label: '梨',
        }]
    };

    handleChange = (e) => {
        this.setState({
            tabValue: e
        })
    }

  render() {
    const { data, tabValue } = this.state;
    return (
      <div>
        <Checkbox 
						options={data} 
						defaultValue={tabValue} 
						onChange={this.handleChange} /> 
      </div>
    );
  }
}

ReactDOM.render(<RadioDemo />, mountNode);

相关资料

• react component checkbox react-beautiful-checkbox