forgeplus-react/src/forge/Index.js

import React , { Component } from 'react';

import {Route,Switch,Link} from 'react-router-dom';
import { withRouter } from 'react-router'


import { SnackbarHOC } from 'educoder';
import { CNotificationHOC } from '../modules/courses/common/CNotificationHOC';
import { TPMIndexHOC } from '../modules/tpm/TPMIndexHOC';

import './css/index.css';

import Loadable from 'react-loadable';
import Loading from '../Loading';
import {ImageLayerOfCommentHOC} from '../modules/page/layers/ImageLayerOfCommentHOC';

import axios from 'axios';



const ProjectNew = Loadable({
	loader: () => import('./New/Index'),
	loading: Loading,
})
const ProjectIndex = Loadable({
	loader: () => import('./Main/Index'),
	loading: Loading,
})

const ProjectDetail = Loadable({
	loader: () => import('./Main/Detail'),
	loading: Loading,
})

class Index extends Component{
  constructor(props){
    super(props);
  }

  

  render(){
    console.log("123",this.props);
    return(
      <div className="newMain clearfix">
        <Switch {...this.props}>
          <Route path="/projects/:projectsType/new"
            render={
              (props) => (<ProjectNew {...this.props} {...props} {...this.state}/>)
            }
          ></Route>
          <Route path="/projects/:projectsId"
            render={
              (props) => (<ProjectDetail {...this.props} {...props} {...this.state}/>)
            }
          ></Route>
          <Route exact path="/projects"
            render={
              (props) => (<ProjectIndex {...this.props} {...props} {...this.state}/>)
            }
          ></Route>
        </Switch>
      </div>
    )
  }
}
export default withRouter(ImageLayerOfCommentHOC({imgSelector: '.imageLayerParent img, .imageLayerParent .imageTarget', parentSelector: '.newMain'})(CNotificationHOC() ( SnackbarHOC() ( TPMIndexHOC(Index) ))));