Class ProgressDemo

demo/example/ProgressDemo.jsx:4–108

import {Progress} from './index';

export default class ProgressDemo extends Component {
    constructor(props){
        super(props);
        this.state = {
            value: 30,
        };
    }

    handleMinus(){
        let {value} = this.state;
        value -= 10;
        if (value < 0) value = 0;
        this.setState({
            value,
        });
    }

    handlePlus(){
        let {value} = this.state;
        value += 10;
        if (value > 100) value = 100;
        this.setState({
            value
        });
    }

    render() {
        const {value} = this.state;
        return (
            <div>
                <h3>Progress</h3>
                <ol style={{'width': '80%'}}>
                    <li>
                        <h4>Default progress</h4>
                        <Progress value={value}/>
                        <h2>
                            <a href="javascript:;" onClick={this.handleMinus.bind(this)}>-</a>
                            <span>  </span>
                            <a href="javascript:;" onClick={this.handlePlus.bind(this)}>+</a>
                        </h2>
                        <pre>
                            <code>
                                {`<Progress value={value}/>`}                                
                            </code>
                        </pre>
                    </li>
                    <li>
                        <h4>Animated progress</h4>
                        <Progress value={40} status="active"/>
                        <pre>
                            <code>
                                {`<Progress value={40} status="active"/>`}   
                            </code>
                        </pre>
                    </li>
                    <li>
                        <h4>Completed progress</h4>
                        <Progress value={100}/>