react-router中的BrowserRouter和Router有什么区别? [英] What is the difference between BrowserRouter and Router in react-router?

问题描述

我正在尝试为我的应用程序实现基本路由，但遇到了 BrowserRouter 和 Router 之间的区别.就我而言，Router 工作正常，BrowserRouter 没有正确路由.

我正在使用历史对象.当用户点击一个按钮时，它需要被带到登录页面history.push('/login')

<预><代码>const 路由 = () =><路由器历史={历史}><开关><路由精确路径=/";组件={Home}/><路由路径="/login";组件={登录}/></开关></路由器>

以上一项工作，但如果我使用 BrowserRouter 而不是路由器，则无法正常工作.

解决方案

简单来说，它们是相等的:

import { BrowserRouter } from 'react-router-dom'<浏览器路由器><应用程序/></BrowserRouter>

和

import { Router } from 'react-router-dom'从历史"导入 { createBrowserHistory }const 历史记录 = createBrowserHistory()<路由器历史={历史}><应用程序/></路由器>

I’m trying to implement basic routing for my application but got stuck with the difference between the BrowserRouter and Router. In my case Router is working properly, BrowserRouter is not routing properly.

I’m using a history object. When the user clicks a button, it needs to be taken to the login page history.push('/login')

const Routing = () => 
    <Router history={history}>
        <Switch>
            <Route exact path="/" component={Home} />
            <Route path="/login" component={Login} />
        </Switch>
    </Router>

Above one work, but if I use BrowserRouter instead of Router it is not working properly.

解决方案

Simply, they are both to equal each other:

import { BrowserRouter } from 'react-router-dom'

<BrowserRouter>
  <App />
</BrowserRouter>

and

import { Router } from 'react-router-dom'
import { createBrowserHistory } from 'history'

const history = createBrowserHistory()

<Router history={history}>
  <App />
</Router>

这篇关于react-router中的BrowserRouter和Router有什么区别?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！