如何解决获取有关网址更改的新数据
我正在开发一个React应用。所以我的主页中有这些组件
- 侧边栏
- 侧边栏建议
- 标签
- 标记建议
我的主要路由如下:
<Router>
<Route path={["/","/home","/tags/:tagId"]} component ={Home}/>
</Router>
我的Home组件是:
<Router>
<Sidebar {some Props} />
<Switch>
<Route
exact
path={["/","/home"]}
render={(props) => (
<Suggestions {some props} />
)}
/>
<Route exact path="/tags/:tagId" component={TagsSuggestion} />
</Switch>
<Tags { some props} />
</Router>
因此,每当我单击侧边栏中的任何数据时,我都希望呈现侧边栏建议
每当我单击标签组件中的任何标签时,它将重定向到带有标签ID的“ / tags /:tagId”。
问题: 首先,将显示补充工具栏建议,当我单击标签时,将加载标签建议组件,并且URL会更改。但是,如果我单击其他标签,则不会呈现该组件,并且建议也不会更改,因此我必须手动重新加载页面才能看到“标签建议”组件。
“我的标签建议”文件与此较小版本相似
import React from "react";
class TagsSuggestion extends React.Component {
constructor(props) {
super(props);
this.state = {
tag: null
};
}
componentDidMount() {
this.setState({ tag: this.props.match.params.id });
// Here I fetch the data
}
render() {
return <h3> This is Tag {this.state.tag} Suggestion</h3>;
}
}
export default TagsSuggestion;
我知道是什么问题。 componentDidMount仅执行一次,但是还有其他选择可以工作,并且只要单击标签就可以获取新数据
沙盒:https://codesandbox.io/s/unruffled-wave-v9m3r?file=/src/TagsSuggestion.js
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。