BrowserRouterをコンポーネントから移動しようとしました。私のアプリケーションは次のようになりました:react-router-domのBrowserRouterはコンポーネントをレンダリングしません。
class App extends Component {
constructor(props) {
super(props);
this.state = {
}
}
render() {
return (
<BrowserRouter>
<main>
<Menu />
<Switch>
<Route exact path="/about" component = {About} />
<Route exact path="/admin" component = {BooksForm} />
<Route exact path="/cart" component = {Cart} />
<Route exact path="/" component = {BookList} />
</Switch>
<Footer />
</main>
</BrowserRouter>
);
}
}
すべてうまくいきました。しかし、私がBrowserRouterを引き上げると、index.jsは次のようになります。
const renderApp =() => (
<Provider store={createStoreWithMiddleware(reducers)}>
<BrowserRouter>
<App/>
</BrowserRouter>
</Provider>
)
const root = document.getElementById('app')
render(renderApp(), root)
これは動作を停止しました。リンクの1つをクリックすると、URLが変わりますが、アプリに変更はありません。私はページをリロードするときだけ、新しいコンポーネントをレンダリングします。 Switchと同じコンポーネントにルータコンポーネントを置かずに、どのように動作させることができますか?