为什么mobx 和 react-router结合使用,浏览器URL改变了,但是页面没有跳转?

新手上路,请多包涵

组件使用inject和withRouter

export default inject(({ history, user }) => ({
  history,
  userInfo: user.userInfo,
}))(withRouter(TicketList));

从props里面获取history和match参数

const {
    history: {
      push,
    },
    match: {
      path: matchPath,
    },
  } = props;

路由信息

<Switch>
  <Route exact path={matchPath} render={renderLists} />
  <Route path={`${matchPath}/:type/:ticketId`} render={renderDetail} />
</Switch>

改变路由行为

const handleOpenDetail = (ticketId, type) => {
    push(`${matchPath}/${type}/${ticketId}`);
};

const returnToList = () => {
    push(matchPath);
};

在列表页点击详情,浏览器url改变了,但是页面没跳转,但是刷新浏览器,页面就跳转到详情页了,这说明路由匹配没问题。这里浏览url改变了,为什么组件没有重新渲染呢?

阅读 3.6k
1 个回答

没必要用mobx控制路由。可以自己使用路由自带的监听功能
this.props.history.listen(() => {

  
})
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题