ant-design/components/progress/demo/dynamic.md

39 lines
647 B
Markdown
Raw Normal View History

2015-06-15 14:43:27 +08:00
# 动态展示
- order: 4
会动的进度条才是好进度条。
---
````jsx
2015-06-15 15:11:02 +08:00
var Progress = antd.Progress.Line;
2015-06-15 14:43:27 +08:00
var MyProgress = React.createClass({
getInitialState() {
return {
percent: 0
};
},
componentDidMount: function() {
var self = this;
setInterval(function() {
if (self.state.percent < 100) {
2015-06-16 21:24:09 +08:00
self.state.percent += 4;
2015-06-15 14:43:27 +08:00
}
self.setState({
percent: self.state.percent
});
2015-06-16 21:24:09 +08:00
}, 200);
2015-06-15 14:43:27 +08:00
},
render() {
2015-06-15 16:31:51 +08:00
return <Progress percent={this.state.percent} />;
2015-06-15 14:43:27 +08:00
}
});
React.render(
<MyProgress />
, document.getElementById('components-progress-demo-dynamic'));
````