componentDidMount仅在组件最初安装在DOM中且URL参数更改时未安装新组件时才运行。
您需要使用
componentDidUpdate并检查URL参数是否已更改,如果是这种情况,请再次获取数据。
例
function getData() { return new Promise(resolve => { setTimeout(() => { resolve(Array.from({ length: 3 }, () => Math.random())); }, 1000); });}class Page extends React.Component { state = { data: [] }; componentDidMount() { getData().then(data => { this.setState({ data }); }); } componentDidUpdate(prevProps) { if (prevProps.match.params.pathParam !== this.props.match.params.pathParam) { getData().then(data => { this.setState({ data }); }); } } render() { return ( <div> {this.state.data.map(element => <div key={element}>{element}</div>)} </div> ); }}class App extends React.Component { render() { return ( <BrowserRouter> <div> <link to="foo"> Foo </link> <link to="bar"> Bar </link> <Switch> <Route path="/:pathParam" component={Page} /> </Switch> </div> </BrowserRouter> ); }}


