Reactjs React路由器链接更改URL但不更改'；重排机

我正在使用MobX通过React和React router呈现一些订单。当我使用链接时，URL会改变，但视图不会被渲染。当我刷新页面时，视图将保持原样。我搜索了一会儿，发现MobX observer阻止了重新提交，因为它使用shouldComponentUpdate。我尝试使用定位方法，因为该道具会发生变化并触发重新渲染，但这似乎没有帮助

我也尝试使用withRouter，但作为一名装饰师，我没有成功实现这一点

更新
据说装修工在破坏路由器？使用withRouter为他们修复了它，但我仍然不知道如何在我的代码中实现它

index.js

ReactDOM.render((
  <Provider {...stores}>
    <BrowserRouter>
      <App location={location} />
    </BrowserRouter>
  </Provider>
),
  document.getElementById('root')
);

import React from 'react';
import {Switch, Route, withRouter} from 'react-router-dom';
import {Order} from './components';
import {AllOrders} from './containers';
import {inject, observer} from 'mobx-react';
import {isEmpty} from 'lodash';

const App = ({orders, location}) => {
  console.log(location);
  return(
    <Switch>
      {
        !isEmpty(orders) && <Route exact path="/orders" render={(props) => (<AllOrders {...props} orders={orders} />)} />
      }
      {
        !isEmpty(orders) && <Route path="/orders/:id" render={(props) => (<Order {...props} orders={orders} />)} />
      }
    </Switch>
  )
}

export default inject(
  ({orderStore}) => ({
    orders: orderStore.orders
  })
)(
  observer(App)
);

ReactDOM.render((
),
document.getElementById（'root'））
);

App.js

ReactDOM.render((
  <Provider {...stores}>
    <BrowserRouter>
      <App location={location} />
    </BrowserRouter>
  </Provider>
),
  document.getElementById('root')
);

import React from 'react';
import {Switch, Route, withRouter} from 'react-router-dom';
import {Order} from './components';
import {AllOrders} from './containers';
import {inject, observer} from 'mobx-react';
import {isEmpty} from 'lodash';

const App = ({orders, location}) => {
  console.log(location);
  return(
    <Switch>
      {
        !isEmpty(orders) && <Route exact path="/orders" render={(props) => (<AllOrders {...props} orders={orders} />)} />
      }
      {
        !isEmpty(orders) && <Route path="/orders/:id" render={(props) => (<Order {...props} orders={orders} />)} />
      }
    </Switch>
  )
}

export default inject(
  ({orderStore}) => ({
    orders: orderStore.orders
  })
)(
  observer(App)
);

从“React”导入React；
从“react router dom”导入{Switch，Route，withRouter}；
从“./components”导入{Order}；
从“./containers”导入{AllOrders}；
从“mobx react”导入{inject，observer}；
从“lodash”导入{isEmpty}；
常量应用=（{订单，位置}）=>{
控制台日志（位置）；
返回(
{
！isEmpty（订单）&&（（）}/>
}
{
！isEmpty（订单）&&（（）}/>
}
)
}
导出默认注入(
（{orderStore}）=>({
订单：orderStore.orders
})
)(
观察员（应用程序）
);

AllOrders.js

class AllOrders extends Component{

  render(){
    const {orders} = this.props;
    return(
      <div>
        {
          !isEmpty(orders) &&
          orders.map((props, key) => {
            return(
              <Link to={`/orders/${props.id}`} key={key}>{props.id}<br /></Link>
            )
          })
        }
      </div>
    )
  }
}

export default AllOrders;

类AllOrders扩展组件{
render（）{
const{orders}=this.props；
返回(
{
！isEmpty（订单）&&
orders.map（（道具、钥匙）=>{
返回(
{props.id}

)
})
}
)
}
}
导出默认Allorder；

在我的浏览器路由器中，我添加了组件应用程序，它应该是一条通过组件应用程序的路由。这使得路由再次工作。解决方案是将我的index.js更改为

ReactDOM.render((
  <Provider {...stores}>
    <BrowserRouter>
      <Route component={App} />
    </BrowserRouter>
  </Provider>
),
  document.getElementById('root')
);

ReactDOM.render((
),
document.getElementById（'root'））
);

当你改变路线时，你的应用程序会重新启动吗？不会，不会触发位置日志。我还添加了包含链接的组件。