react-router4怎么在路由变化时重新渲染同一个组件？

Question

刚开始我的地址是：http://192.168.1.74:3000/#/houseDetail/788052?ldbh=29430025。
然后我点击下一条时：

history.push({
            pathname: '/houseDetail/' + nextFwbh,
            search: `ldbh=${nextLdbh}`
        })

地址会变成http://192.168.1.74:3000/#/houseDetail/788053?ldbh=29430025，但是因为是同一个组件，这时页面不会重新加载，只是路由变了，有没有什么方法能够是路由重新渲染当前的组件？

Answer 1

可以在这个组件的componentWillReceiveProps方法中去判断，当url变化时，这个方法会被调用，通过props.match.params获取最新url参数，然后执行相关逻辑。

Answer 2

可以用 history 中的 listen 方法监听 url 的变化，然后通过 state 的变化触发渲染。

this.unlisten = history.listen(location => {
  this.setState({ pathname: location.pathname });
});

Answer 3

export default function (props) {
  return (<组件 {...props} key={search参数} />)
}

重新封装一下组件，加入一个key

Answer 4

你确定它没有进入更新阶段？

Answer 5

在路由跳转的地方加入KEY是一个办法。

<Route path='/sdspace/offline/:id/detail' exact component={SdSpace.Detail} key={new Date().getTime()} />
<Route path='/sdspace/offline/:id/edit' exact component={SdSpace.Detail} key={new Date().getTime()} />