gpt4 book ai didi

javascript - 链接到 React 中的另一个页面

转载 作者:行者123 更新时间:2023-11-28 16:51:09 25 4
gpt4 key购买 nike

我想从一个 React 页面链接到静态站点上的另一个页面,但我的路由一直链接到 /#/info这似乎没有做任何事情。

我的index.js文件:

ReactDOM.render(<App />, document.getElementById('root'));

我的 App.js 文件:

import React from 'react'
import { HashRouter, Switch, Route, Link } from 'react-router-dom'
import Stream from './Stream.js'
import Info from './Info.js'

function App() {
return (
<HashRouter>
<Switch>
<Route exact path='/' component='Stream' />
<Route path='/info' component='Info' />
</Switch>
<Link to='/info'>Info</Link>
<Stream />
</HashRouter>
);
}
export default App;

我的 Stream.js:

import React from 'react'

function Stream() {
return (
<div>Stream</div>
);
}
export default Stream;

我的Info.js:

import React from 'react'
import { Switch, Route } from 'react-router-dom'

function Info() {
return (
<h1>Info</h1>
);
}
export default Info;

根据this url 被重写为 /#/info这是预期的行为,但单击链接时我的内容未加载。我要 <Stream />离开并查看 <Info /> 的内容取代它的位置。

最佳答案

如果您传入实际组件而不是它们的名称作为字符串,您的代码可以正常工作:

<Switch>
<Route exact path="/" component={Stream} />
<Route path="/info" component={Info} />
</Switch>

关于javascript - 链接到 React 中的另一个页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59941339/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com