React how to create custom page for 404?

Question

<MuiThemeProvider theme={muiTheme}>
            <V0MuiThemeProvider muiTheme={muiThemeV0}>
                <React.Fragment>
                    <Helmet
                        defaultTitle="Life"
                        titleTemplate="Life: %s"
                    />

                    <Switch>
                        <UnderDevelopmentPage path="/underdevelopment" component={UnderDevelopmentPage}/>
                        <LayoutDefault exact path={MyProfilePage.Path} component={MyProfilePage}/>
                        <LayoutDefault path={MyResultsPage.Path} component={MyResultsPage}/>
                        <LayoutDefault path={MyPlansPage.Path} component={MyPlansPage}/>
                        <LayoutDefault path={MyFinancePage.Path} component={MyFinancePage}/>
                        <LayoutDefault path={MyBenefitsPage.Path} component={MyBenefitsPage}/>
                        <LayoutDefault path={BIClub.Path} component={BIClub}/>
                        <LayoutDefault path={BIClubCatalogPage.Path} component={BIClubCatalogPage}/>
                        <LayoutDefault path={BIClubCompanyPage.Path} component={BIClubCompanyPage}/>
                        <LayoutDefault path={BIClubDiscountPage.Path} component={BIClubDiscountPage}/>
                        <LayoutDefault path={MyEventsPage.Path} component={MyEventsPage}/>
                        <LayoutDefault path={CompanyEventsPage.Path} component={CompanyEventsPage}/>
                        <LayoutDefault path={OutsideEventsPage.Path} component={OutsideEventsPage}/>
                        <LayoutDefault path={HistoryPage.Path} component={HistoryPage}/>
                        <LayoutDefault path={OutboxPage.Path} component={OutboxPage}/>
                        <LayoutDefault path={InboxPage.Path} component={InboxPage}/>
                        <LayoutDefault path="/404" component={Notfound}/>



                    </Switch>
                    <LeftSidebar/>
                </React.Fragment>
            </V0MuiThemeProvider>
        </MuiThemeProvider>

What a layotdefault i need to do for a page what doesnt have any route??? for all 404 page? This is all my route code simple Redirect doesnt help to me

You cand find the answer [in here](https://stackoverflow.com/a/37491381/10710149) — Shahram, Dec 06 '18 at 09:46
why do you use `path="/404"` for notfound ? you don't need to redirect to not found route. if route path not found in your routes it will match the not found route by default if you omit `path="/404"` — Shahram, Dec 06 '18 at 10:46
when i use path="*" for all unknown pages my all site will use Notfound component and i didnt see another pages( — Bistore.bi-group, Dec 06 '18 at 10:50
omit `path` no need for path and if that doesn't work then add ` your routes` — Shahram, Dec 06 '18 at 10:53
can you put the `LayoutDefault` code as well.i can help you if i see that — Shahram, Dec 06 '18 at 11:04

score 0 · Answer 1 · answered Dec 06 '18 at 11:22

Passing anything besides a <Route> or <Redirect> is not encouraged, because <Switch> treat each child as route and Redirect is just an alias of Route.

Try to change your code like below:

<UnderDevelopmentPage path="/underdevelopment" component={UnderDevelopmentPage}/>
<LayoutDefault>
    <Switch>
        <Route exact path={MyProfilePage.Path} component={MyProfilePage}/>
        <Route path={MyResultsPage.Path} component={MyResultsPage}/>
        <Route path={MyPlansPage.Path} component={MyPlansPage}/>
        <Route path={MyFinancePage.Path} component={MyFinancePage}/>
        <Route path={MyBenefitsPage.Path} component={MyBenefitsPage}/>
        <Route path={BIClub.Path} component={BIClub}/>
        <Route path={BIClubCatalogPage.Path} component={BIClubCatalogPage}/>
        <Route path={BIClubCompanyPage.Path} component={BIClubCompanyPage}/>
        <Route path={BIClubDiscountPage.Path} component={BIClubDiscountPage}/>
        <Route path={MyEventsPage.Path} component={MyEventsPage}/>
        <Route path={CompanyEventsPage.Path} component={CompanyEventsPage}/>
        <Route path={OutsideEventsPage.Path} component={OutsideEventsPage}/>
        <Route path={HistoryPage.Path} component={HistoryPage}/>
        <Route path={OutboxPage.Path} component={OutboxPage}/>
        <Route path={InboxPage.Path} component={InboxPage}/>
        <Route component={Notfound}/>
    </Switch>

</LayoutDefault>

score 0 · Answer 2 · answered Dec 06 '18 at 11:30

0

Hey :D I think you should use <route> nested on your <LayoutDefault>.

answered Dec 06 '18 at 11:30

Nick Kafka

3
2

React how to create custom page for 404?

2 Answers2