Learning Redux

Creating the Router component

It's time to create the actual Router component, which will take the route state as a property and decide which page to show based on it. To create the Router component, perform the following steps:

1. Create a new file src/components/Router.jsx and import the two-page components we created earlier:

import React from 'react'import MainPage from './pages/MainPage.jsx'import AboutPage from './pages/AboutPage.jsx'

2. Then define the Router component, which takes the current route as property:

const Router = ({ route }) => {

3. We use a switch statement to decide which page to show:

  switch (route) {    case 'about':      return <AboutPage />        default:    case 'main':      return <MainPage />  }}

4. Do not forget to export the component: ...