我的routes.js
文件中有以下代码
import React, { Component } from 'react'
import { BrowserRouter as Router, Route, Switch, Redirect } from 'react-router-dom'
import Home from './components/home/Home.jsx'
import Dashboard from './components/dashboard/Dashboard.jsx'
import { browserHistory } from 'react-router'
class Routes extends Component {
render () {
return (
<Router history={browserHistory}>
<div>
<Switch>
<Route path='/home' component={() => (<Home />)} />
<Route path='/dashboard' component={() => (<Dashboard />)} />
<Redirect to={{pathname: '/home'}} />
</Switch>
</div>
</Router>
)
}
}
export default Routes
以下是我的
Home.jsx
import React, { Component } from 'react'
import {Link} from 'react-router-dom'
class Home extends Component {
render () {
return (
<div>
<h1>This is a home page.</h1>
<button>
<Link to='/dashboard'>Click here (Dashboard)</Link>
</button>
</div>
)
}
}
export default Home
但是,如果我单击
Home.jsx
中存在的按钮,则它在chrome和safari中可以正常工作,并将我重定向到Dashboard
页面,但是(``Home.jsx`中的此按钮'')在Firefox中没有响应。而且我不明白它会卡在Firefox中吗?那么有人可以帮我吗?提前致谢。
最佳答案
我遇到了同样的问题,发现您通过将<button>
嵌套在<Link>
内来使其在Firefox中工作:
class Home extends Component {
render () {
return (
<div>
<h1>This is a home page.</h1>
<Link to="/dashboard">
<button>
Click here (Dashboard)
</button>
</Link>
</div>
)
}
}
关于javascript - 在firefox中react-router-dom的链接不起作用,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/51665178/