refactor: generate className with rcUtil.classSet

This commit is contained in:
Benjy Cui 2015-10-09 16:42:08 +08:00
parent 88f6be5855
commit f4ca0798de
2 changed files with 17 additions and 25 deletions

View File

@ -1,20 +1,18 @@
import React from 'react';
import rcUtil from 'rc-util';
const prefix = 'ant-btn-group-';
export default class ButtonGroup extends React.Component {
render() {
const {size, className, ...others} = this.props;
const classes = rcUtil.classSet({
'ant-btn-group': true,
[prefix + size]: size,
[className]: className
});
let classSet = ['ant-btn-group'];
if (size) {
classSet.push(prefix + size);
}
if (className) {
classSet.push(className);
}
return <div {...others} className={classSet.join(' ')} />;
return <div {...others} className={classes} />;
}
}
ButtonGroup.propTypes = {

View File

@ -1,4 +1,5 @@
import React from 'react';
import rcUtil from 'rc-util';
const rxTwoCNChar = /^[\u4e00-\u9fa5]{2,2}$/;
const isTwoCNChar = rxTwoCNChar.test.bind(rxTwoCNChar);
@ -7,11 +8,6 @@ function isString(str) {
}
const prefix = 'ant-btn-';
function updateClassWithProp(classSet, prop) {
if (prop) {
classSet.push(prefix + prop);
}
}
// Insert one space between two chinese characters automatically.
function insertSpace(child) {
@ -32,20 +28,18 @@ export default class Button extends React.Component {
const props = this.props;
const {type, shape, size, onClick, className, children, ...others} = props;
let classSet = ['ant-btn'];
updateClassWithProp(classSet, type);
updateClassWithProp(classSet, shape);
updateClassWithProp(classSet, size);
if ('loading' in props && props.loading !== false) {
classSet.push(prefix + 'loading');
}
if (className) {
classSet.push(className);
}
const classes = rcUtil.classSet({
'ant-btn': true,
[prefix + type]: type,
[prefix + shape]: shape,
[prefix + size]: size,
[prefix + 'loading']: ('loading' in props && props.loading !== false),
[className]: className
});
const kids = React.Children.map(children, insertSpace);
return <button {...others} type="button" className={classSet.join(' ')} onClick={onClick}>
return <button {...others} type="button" className={classes} onClick={onClick}>
{kids}
</button>;
}