dtd
Version:
根据数梦工场视觉规范打造的组件库,感谢react-components和ant design
1 lines • 2.28 kB
JavaScript
import _toConsumableArray from"babel-runtime/helpers/toConsumableArray";import _classCallCheck from"babel-runtime/helpers/classCallCheck";import _createClass from"babel-runtime/helpers/createClass";import _possibleConstructorReturn from"babel-runtime/helpers/possibleConstructorReturn";import _inherits from"babel-runtime/helpers/inherits";import*as React from"react";import*as PropTypes from"prop-types";import classNames from"classnames";import shallowEqual from"shallowequal";import Checkbox from"./Checkbox";var CheckboxGroup=function(e){function t(e){_classCallCheck(this,t);var o=_possibleConstructorReturn(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return o.toggleOption=function(e){var t=o.state.value.indexOf(e.value),a=[].concat(_toConsumableArray(o.state.value));-1===t?a.push(e.value):a.splice(t,1),"value"in o.props||o.setState({value:a});var r=o.props.onChange;r&&r(a)},o.state={value:e.value||e.defaultValue||[]},o}return _inherits(t,e),_createClass(t,[{key:"getChildContext",value:function(){return{checkboxGroup:{toggleOption:this.toggleOption,value:this.state.value,disabled:this.props.disabled}}}},{key:"componentWillReceiveProps",value:function(e){"value"in e&&this.setState({value:e.value||[]})}},{key:"shouldComponentUpdate",value:function(e,t){return!shallowEqual(this.props,e)||!shallowEqual(this.state,t)}},{key:"getOptions",value:function(){return this.props.options.map(function(e){return"string"==typeof e?{label:e,value:e}:e})}},{key:"render",value:function(){var e=this,t=this.props,o=this.state,a=t.prefixCls,r=t.className,s=t.style,l=t.options,n=t.children;l&&l.length>0&&(n=this.getOptions().map(function(r){return React.createElement(Checkbox,{key:r.value,disabled:"disabled"in r?r.disabled:t.disabled,value:r.value,checked:-1!==o.value.indexOf(r.value),onChange:function(){return e.toggleOption(r)},className:a+"-item"},r.label)}));var i=classNames(a,r);return React.createElement("div",{className:i,style:s},n)}}]),t}(React.Component);export default CheckboxGroup;CheckboxGroup.defaultProps={options:[],prefixCls:"dt-checkbox-group"},CheckboxGroup.propTypes={defaultValue:PropTypes.array,value:PropTypes.array,options:PropTypes.array.isRequired,onChange:PropTypes.func},CheckboxGroup.childContextTypes={checkboxGroup:PropTypes.any};