mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-12-02 12:09:14 +08:00
Add badge demo
This commit is contained in:
parent
0b55ced857
commit
bf8b156413
52
components/badge/demo/change.md
Normal file
52
components/badge/demo/change.md
Normal file
@ -0,0 +1,52 @@
|
||||
# 动态
|
||||
|
||||
- order: 4
|
||||
|
||||
展示动态变化的效果。
|
||||
|
||||
---
|
||||
|
||||
````jsx
|
||||
import { Badge, Button, Icon } from 'antd';
|
||||
const ButtonGroup = Button.Group;
|
||||
|
||||
const Test = React.createClass({
|
||||
getInitialState() {
|
||||
return {
|
||||
count: 5
|
||||
};
|
||||
},
|
||||
increase() {
|
||||
const count = this.state.count + 1;
|
||||
this.setState({ count });
|
||||
},
|
||||
decline() {
|
||||
let count = this.state.count - 1;
|
||||
if (count < 0) {
|
||||
count = 0;
|
||||
}
|
||||
this.setState({ count });
|
||||
},
|
||||
render() {
|
||||
return <div>
|
||||
<Badge count={this.state.count}>
|
||||
<a href="#" className="head-example"></a>
|
||||
</Badge>
|
||||
<div style={{ marginTop: 10 }}>
|
||||
<ButtonGroup>
|
||||
<Button type="ghost" onClick={this.decline}>
|
||||
<Icon type="minus" />
|
||||
</Button>
|
||||
<Button type="ghost" onClick={this.increase}>
|
||||
<Icon type="plus" />
|
||||
</Button>
|
||||
</ButtonGroup>
|
||||
</div>
|
||||
</div>;
|
||||
}
|
||||
});
|
||||
|
||||
ReactDOM.render(
|
||||
<Test />
|
||||
, document.getElementById('components-badge-demo-change'));
|
||||
````
|
Loading…
Reference in New Issue
Block a user