rc-wizard@0.0.9

// use jsx to render html, do not modify simple.html

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import Wizard from 'rc-wizard';
require('rc-wizard/assets/index.css');

class Test extends Component {

  constructor(props) {
    super(props);
    this.state = {
      condition: true,
    };
  }

  changeChildren() {
    const condition = !this.state.condition;
    this.setState({ condition });
  }

  renderConditionPage() {
    if (this.state.condition) {
      return (
        <Wizard.Step key="2">
          I am the second page.
        </Wizard.Step>
      );
    }
  }

  render() {
    return (
      <div>
        <button onClick={() => {this.changeChildren();}}>
          Toggle display second page.
        </button>
        <Wizard id="test" onDone={() => { alert('Wizard is done'); }}>
          <Wizard.Step key="1">
            I am the first page.
          </Wizard.Step>
          {
            this.renderConditionPage()
          }
          <Wizard.Step key="3">
            I am the third page.
          </Wizard.Step>
        </Wizard>
      </div>
    );
  }
}

ReactDOM.render(<Test />, document.getElementById('__react-content'));