frc-ui/es/checkbox/Checkbox.js

React Web UI

import React from 'react';
import classNames from 'classnames';
import Icon from '../components/icon';
class Checkbox extends React.PureComponent {
    constructor(props) {
        super(props);
        this.onClick = (event) => {
            const { disabled, onChange } = this.props;
            const { value } = this.state;
            event.stopPropagation && event.stopPropagation();
            this.setState({ value: !value }, () => {
                if (typeof onChange === 'function' && !disabled) {
                    onChange(!value);
                }
            });
        };
        this.state = {
            value: props.checked
        };
    }
    componentWillReceiveProps(nextProps) {
        if (nextProps.checked !== this.props.checked) {
            this.setState({ value: nextProps.checked });
        }
    }
    render() {
        const { prefix: pre, className, disabled, style, children } = this.props;
        const { value } = this.state;
        const prefix = pre || 'swc-checkbox';
        const cls = classNames('swc-checkbox', className, {
            checked: value,
            [`${prefix}-child`]: !!children,
            [`${prefix}-disabled`]: disabled
        });
        let child = null;
        if (value)
            child = React.createElement(Icon, { type: 'checkbox' });
        return (React.createElement("div", { className: cls, onClick: this.onClick, style: style },
            React.createElement("span", { className: 'swc-checkbox-inner' }, child),
            children));
    }
}
Checkbox.defaultProps = {
    checked: false,
    style: {},
    disabled: false,
    prefix: 'swc-checkbox'
};
export default Checkbox;