radiobutton.md 1.2 KB
Newer Older
A
afc163 已提交
1 2 3 4 5 6 7 8 9
# 按钮样式

- order: 3

按钮样式的单选组合。

---

````jsx
A
afc163 已提交
10 11 12
import { Radio } from 'antd';
const RadioButton = Radio.Button;
const RadioGroup = Radio.Group;
A
afc163 已提交
13 14

function onChange(e) {
15
  console.log(`radio checked:${e.target.value}`);
A
afc163 已提交
16 17
}

A
afc163 已提交
18
ReactDOM.render(<div>
A
afc163 已提交
19
  <div>
20 21 22 23 24 25 26 27
    <RadioGroup onChange={onChange} defaultValue="a">
      <RadioButton value="a">杭州</RadioButton>
      <RadioButton value="b">上海</RadioButton>
      <RadioButton value="c">北京</RadioButton>
      <RadioButton value="d">成都</RadioButton>
    </RadioGroup>
  </div>
  <div style={{ marginTop: 16 }}>
A
afc163 已提交
28 29
    <RadioGroup onChange={onChange} defaultValue="a">
      <RadioButton value="a">杭州</RadioButton>
30
      <RadioButton value="b" disabled>上海</RadioButton>
A
afc163 已提交
31 32 33 34 35 36 37 38 39 40 41 42
      <RadioButton value="c">北京</RadioButton>
      <RadioButton value="d">成都</RadioButton>
    </RadioGroup>
  </div>
  <div style={{ marginTop: 16 }}>
    <RadioGroup disabled onChange={onChange} defaultValue="a">
      <RadioButton value="a">杭州</RadioButton>
      <RadioButton value="b">上海</RadioButton>
      <RadioButton value="c">北京</RadioButton>
      <RadioButton value="d">成都</RadioButton>
    </RadioGroup>
  </div>
43
</div>, mountNode);
A
afc163 已提交
44
````