小编Jea*_*sso的帖子

我有几个路由渲染相同的组件.根据路由,我希望组件获取不同的数据.但是,由于我继续渲染相同的组件,当我单击链接标记(从位于布局组件中的导航栏)到另一个渲染相同组件的路径时,React看不到对DOM的任何更改.意味着组件不会使用新数据重新呈现.这是我的路线:

class App extends Component {
  render() {
    return (
      <BrowserRouter>
        <Provider store={store}>
          <Layout>
            <Switch>
              <Route exact path="/" component={Home} />
              <Route exact path="/fashion" component={PostTypePageContainer} />
              <Route exact path="/beauty" component={PostTypePageContainer} />
            </Switch>
          </Layout>
        </Provider>
      </BrowserRouter>
    );
  }
}
export default App;

这是PostTypePageContainer组件,我想每次使用新数据重新呈现:

class PostTypePageContainer extends Component {
  componentDidMount() {
    let route;
    switch (this.props.location.pathname) {
      case '/fashion':
        route = '/fashion';
        break;
      case '/beauty':
        route = '/beauty';
        break;
      default:
        console.log('No data was found');
    }

    let dataURL = `http://localhost:8888/my-site//wp-json/wp/v2${route}?_embed`;
    fetch(dataURL)
      .then(res => res.json())
      .then(res …