kede-client/js/component/manageCenter/set/content.jsx

import React, { Component } from 'react';
import '../content.less';
import './content.less';
import LeftTab from '../leftTab';
import { getMenu } from '../publicMenu.js'

class Content extends Component {
  constructor() {
    super();
    this.state = {
      loading: false,
      component: <div />,
    };
  }
  componentWillMount() {
    var ids = window.location.href.indexOf('rid=');
    var idk = window.location.href.substr(ids + 4);
    var rid = idk.split('#');
    let menu = getMenu(rid);
    let curry;
    if (menu[0].subMenus.length > 0) {
      curry = menu[0].subMenus[0].url.split('#');
    } else {
      curry = menu[0].url.split('#');
    };
    if (window.location.hash) {
      this.getKey(window.location.hash.substr(1));
    } else {
      this.getKey(curry[1]);
    };
  }
  getKey(key) {
    switch (key) {
      case 'softwareConfigure':
        require.ensure([], () => {
          const SoftwareConfigure = require('./projectConfigure/softwareConfigure').default;
          this.setState({
            component: <SoftwareConfigure />,
          });
        });
        break;
      case 'officialFees':
        require.ensure([], () => {
          const OfficialFees = require('./projectConfigure/officialFees').default;
          this.setState({
            component: <OfficialFees />,
          });
        });
        break;
      case 'patentFees':
        require.ensure([], () => {
          const PatentFees = require('./projectConfigure/patentFees').default;
          this.setState({
            component: <PatentFees />,
          });
        });
        break;
      case 'organization':
        require.ensure([], () => {
          const Organization = require('./organization/organization').default;
          this.setState({
            component: <Organization />,
          });
        });
        break;
      case 'workeTimes':
        require.ensure([], () => {
          const WorkeTimes = require('./workeTimes/index').default;
          this.setState({
            component: <WorkeTimes />,
          });
        });
        break;
      case 'businessCategory':
        require.ensure([], () => {
          const BusinessCategory = require('./business/businessCategory').default;
          this.setState({
            component: <BusinessCategory />
          });
        });
        break;
      case 'businessProject':
        require.ensure([], () => {
          const BusinessProject = require('./business/businessProject').default;
          this.setState({
            component: <BusinessProject />
          });
        });
        break;
      case 'businessQuery':
        require.ensure([], () => {
          const BusinessQuery = require('./business/businessQuery').default;
          this.setState({
            component: <BusinessQuery />
          });
        });
        break;
      case 'user':
        require.ensure([], () => {
          const User = require('./userManagementS/user').default;
          this.setState({
            component: <User />
          });
        });
        break;

      case 'roles':
        require.ensure([], () => {
          const Roles = require('./userManagementS/roles').default;
          this.setState({
            component: <Roles />,
          });
        });
        break;
      case 'permission':
        require.ensure([], () => {
          const Jurisdiction = require('./userManagementS/jurisdiction').default;
          this.setState({
            component: <Jurisdiction />
          });
        });
        break;
      case 'bar':
        require.ensure([], () => {
          const Bar = require('./amoeba/barList').default;
          this.setState({
            component: <Bar />
          });
        });
        break;
      default:
        require.ensure([], () => {
          const Module = require('../module').default;
          this.setState({
            component: <Module />
          });
        });
    };
    window.location.hash = key;
  }
  render() {
    return (
      <div className="manage-content">
        <LeftTab handlekey={this.getKey.bind(this)} />
        <div className="content-right">
          {this.state.component}
        </div>
      </div>
    )
  }
}

export default Content;