我有一个<Routes>
组件,该组件仅呈现<Dashboard>
组件。当我尝试获取<BillingCycle>
组件时,不会发生相同的事情。当我在可能会获取BillingCycle页面的浏览器中输入网址时,不会出现Billing Cycles内容。继续显示仪表板内容。我有什么错?谢谢。
导入'../common/template/dependencies' 从“反应”导入React
这是导入Routes组件的父组件。
import Routes from './Routes'
export default (props) => (
<div className='wrapper'>
<div className='content-wrapper'>
<Routes />
</div>
</div>
)
以下是成功显示在以下网址中的仪表板组件:http://localhost:8080和http://localhost:8080/#/
import React from 'react'
export default props => (
<div>
<h1>Dashboard</h1>
</div>
)
这是我输入网址时未出现的billingCycle组件: http://localhost:8080/#/billingCycles
import React from 'react'
export default props => {
return (
<h1>Ciclo de pagamentos</h1>
)
}
以下是“路线”组件:
import React from 'react'
import { BrowserRouter as Router, Route, Redirect, Switch } from 'react-router-dom';
import Dashboard from '../dashboard/Dashboard'
import BillingCycle from '../billingCycle/BillingCycle'
export default props => (
<Router>
<Switch>
<Route exact path='#/billingCycles' component={BillingCycle} />
<Route exact path='/' component={Dashboard} />
<Redirect from='*' to='/' />
</Switch>
</Router>
)
答案 0 :(得分:1)
如果要在URL中使用哈希,则应使用HashRouter
。而且您不应该在路由中添加哈希:
<Route exact path='/billingCycles' component={BillingCycle} />