我只是在我的 React 应用程序中做一些基本的路由,我以前也这样做过,所以我很困惑为什么它现在不起作用。
我得到的错误是:You should not use <Route> or withRouter() outside a <Router>
我敢肯定这是 super 基础的,所以感谢您与我分享!
import React from 'react'
import { Route } from 'react-router-dom'
import { Link } from 'react-router-dom'
import * as BooksAPI from './BooksAPI'
import BookList from './BookList'
import './App.css'
class BooksApp extends React.Component {
state = {
books: []
}
componentDidMount() {
this.getBooks()
}
getBooks = () => {
BooksAPI.getAll().then(data => {
this.setState({
books: data
})
})
}
render() {
return (
<div className="App">
<Route exact path="/" render={() => (
<BookList
books={this.state.books}
/>
)}/>
</div>
)
}
}
export default BooksApp
最佳答案
你需要为 react-router 设置 context provider
import { BrowserRouter, Route, Link } from 'react-router-dom';
// ....
render() {
return (
<BrowserRouter>
<div className="App">
<Route exact path="/" render={() => (
<BookList
books={this.state.books}
/>
)}/>
</div>
</BrowserRouter>
)
}
旁注 - BrowserRouter
应该放在应用程序的顶层,并且只有一个 child 。
关于javascript - react 路由器错误 : You should not use Route outside of Router,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50545268/