mirror of
https://github.com/ant-design/ant-design.git
synced 2025-08-06 07:56:28 +08:00
refactor: generate className with rcUtil.classSet
This commit is contained in:
parent
88f6be5855
commit
f4ca0798de
@ -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 = {
|
||||
|
@ -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>;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user