mirror of
https://github.com/ant-design/ant-design.git
synced 2025-01-18 14:13:37 +08:00
dynamic demo
This commit is contained in:
parent
15027544ef
commit
e59a6b2430
38
components/progress/demo/circle-dynamic.md
Normal file
38
components/progress/demo/circle-dynamic.md
Normal file
@ -0,0 +1,38 @@
|
||||
# 动态展示
|
||||
|
||||
- order: 4
|
||||
|
||||
会动的进度条才是好进度条。
|
||||
|
||||
---
|
||||
|
||||
````jsx
|
||||
var ProgressCircle = antd.Progress.Circle;
|
||||
|
||||
var MyProgress = React.createClass({
|
||||
getInitialState() {
|
||||
return {
|
||||
percent: 0
|
||||
};
|
||||
},
|
||||
componentDidMount: function() {
|
||||
var self = this;
|
||||
setInterval(function() {
|
||||
if (self.state.percent < 100) {
|
||||
self.state.percent += 2;
|
||||
}
|
||||
self.setState({
|
||||
percent: self.state.percent
|
||||
});
|
||||
}, 100);
|
||||
},
|
||||
render() {
|
||||
return <ProgressCircle percent={this.state.percent} />;
|
||||
}
|
||||
});
|
||||
|
||||
React.render(
|
||||
<MyProgress />
|
||||
, document.getElementById('components-progress-demo-circle-dynamic'));
|
||||
````
|
||||
|
@ -27,7 +27,7 @@ var MyProgress = React.createClass({
|
||||
}, 100);
|
||||
},
|
||||
render() {
|
||||
return <Progress percent={this.state.percent} width="300" strokeWidth="3" />;
|
||||
return <Progress percent={this.state.percent} />;
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -103,7 +103,7 @@ var Circle = React.createClass({
|
||||
<i className='anticon anticon-exclamation'></i>
|
||||
</span>
|
||||
);
|
||||
}else if(this.props.status === 'suucess'){
|
||||
}else if(this.props.status === 'success'){
|
||||
progressInfo = (
|
||||
<span style={textStyle} className='ant-progress-circle-text'>
|
||||
<i className="anticon anticon-check"></i>
|
||||
|
Loading…
Reference in New Issue
Block a user