Add radio button in radio

This commit is contained in:
afc163 2015-08-21 18:24:09 +08:00
parent e23372b6e8
commit 0d33a5fbb4
6 changed files with 70 additions and 22 deletions

View File

@ -0,0 +1,26 @@
# 按钮样式
- order: 3
按钮样式的单选组合。
---
````jsx
var RadioButton = antd.Radio.Button;
var RadioGroup = antd.Radio.Group;
function onChange(e) {
console.log('radio checked:' + e.target.value);
}
React.render((
<RadioGroup onChange={onChange} defaultValue="a">
<RadioButton value="a">A</RadioButton>
<RadioButton value="b">B</RadioButton>
<RadioButton value="c">C</RadioButton>
<RadioButton value="d">D</RadioButton>
</RadioGroup>
), document.getElementById('components-radio-demo-radiobutton'));
````

View File

@ -2,13 +2,13 @@
- order: 1
RadioGroup 组合
一组互斥的 Radio 配合使用
---
````jsx
var Radio = antd.Radio;
var RadioGroup = antd.RadioGroup;
var RadioGroup = antd.Radio.Group;
var App = React.createClass({
getInitialState: function () {

View File

@ -1,5 +1,5 @@
import React from 'react';
import Radio from './index';
import Radio from './radio';
function getCheckedValue(children) {
var checkedValue = null;

View File

@ -1,18 +1,5 @@
import Radio from 'rc-radio';
import React from 'react';
import AntRadio from './radio';
import Group from './group';
export default React.createClass({
getDefaultProps() {
return {
prefixCls: 'ant-radio'
};
},
render() {
return (
<label>
<Radio {...this.props} children={null} />
{this.props.children}
</label>
);
}
});
AntRadio.Group = Group;
export default AntRadio;

View File

@ -0,0 +1,36 @@
import Radio from 'rc-radio';
import React from 'react';
let AntRadio = React.createClass({
getDefaultProps() {
return {
prefixCls: 'ant-radio'
};
},
render() {
let checkedClassName = this.props.checked ? this.props.className + '-checked' : '';
return (
<label className={this.props.className + ' ' + checkedClassName}>
<Radio {...this.props} children={null} />
{this.props.children}
</label>
);
}
});
let Button = React.createClass({
getDefaultProps() {
return {
className: 'ant-radio-button'
};
},
render() {
return (
<AntRadio {...this.props} />
);
}
});
AntRadio.Button = Button;
export default AntRadio;

View File

@ -36,7 +36,6 @@ const antd = {
Slider: require('./components/slider'),
EnterAnimation: require('./components/enter-animation'),
Radio: require('./components/radio'),
RadioGroup: require('./components/radio/group'),
Notification: require('./components/notification'),
Alert: require('./components/alert'),
Validation: require('./components/validation'),