Question

首先，我有这段代码：

class navitem extends Component {
    state = {
        isShown: false
    }
    render() {
        return (
            <Router>
                <div>
                    <div href={'#' + this.props.dName} className="navItem">
                        <Link to={"/" + this.props.url}>{this.props.dName}</Link>
                    </div>

                    <Route path={"/textversion"} exact component={TextVersion} />
                </div>
            </Router >
        )
    }
}

如果我单击按钮，它将显示我的TextVersion组件，这在第一次时效果很好。问题是当我重新加载该组件加载到每个navItem的页面时，为什么？

Answer 1

这里的问题首先是Router
必须像这样在您的应用周围添加Router：
ReactDOM.render(<Router><App /></Router>, document.getElementById('root'));

我在导航栏上方添加了路线，如下所示：
<Route path="/textversion" component={TextVersion} />

在我的navItem本身中，我写了到之前定义的Route的链接，如下所示：
<Link to={"/" + this.props.url}>{this.props.dName}</Link>

路由器重载时重复

1 个答案: