在项目中,处理列表跳转详情时遇到了问题。初时代码如下:
import React, { Component } from 'react'
import { observer, inject } from 'mobx-react';
import { Wrapper, ModalWrapper, ScrollWrapper } from './style'
import ContentReport from '../contentListReport';
@inject('base','constructionReport')
@observer
class ImageProgressReportList extends Component {
constructor(props) {
super(props)
}
async handleRowEnterDetail(val) {
localStorage.setItem("constructionReportStorage",JSON.stringify(val));
this.props.history.push("/workZoneManage/details");
}
render() {
return (
<Wrapper className="page-container">
...
</Wrapper>
)
}
}
export default ImageProgressReportList;
报错
先处理报错
import {withRouter} from 'react-router-dom'
...
export default withRouter (ImageProgressReportList);
再设置路由模块
完成页面跳转
import React, { Component } from 'react';
import { Switch, Route } from 'react-router-dom'
import loadable from "@loadable/component";
import KeepAlive from 'react-activation';
const ConstructionReportDetails = loadable(() => import('@v/workZoneManage/imageProgressReport/details'));
/** 模块路由 */
class WorkZoneManageRouter extends Component {
constructor(props) {
super(props);
}
render() {
return (
<Switch>
<Route path="/workZoneManage/imageProgressReport/details"><KeepAlive name="/workZoneManage/imageProgressReport/details" title='施工报表'><ConstructionReportDetails /></KeepAlive></Route>
</Switch>
);
}
}
export default WorkZoneManageRouter;