React Routes Switch in Ionic can not route to an IonPage

Open
#2,570 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
3/5
Estimated time
1-2 days
Newbie friendliness
32/100
Issue type
Documentation
Clarity
Needs clarification
Activity status
Stale
Tech stack
react
Domain
documentation

Research direction

Start with the React navigation documentation at the URL in the issue, especially the section on switches in IonRouterOutlet. Determine whether the example or its explanation should address routing to components wrapped in IonPage; done means the documentation accurately explains the supported behavior and limitation.

Written by the indexing model from the issue text.

Description

triage
URL

https://ionicframework.com/docs/react/navigation#switches-in-ionrouteroutlet

Issue Description

The Switch component can not route to a sub component that is wrapped in IonPage.

This is what I think is the reason.
Because IonPage is exclusive, there can only be a single IonPage in a view. The Switch can not route to a component with IonPage. As shown by the React Router documentation "basic" example, a custom page component can implement a list of links that uses a Switch to route a subview of components below it within the same view. This would result in nested IonPage components, and therefore doesn't work.

The Switch component is useful only in the case where you want to insert components into a subview that will update the URL and work with the history stack, but in a way that is not tabs.

Dominant language
MDX
Stars
621
Forks
3.2k
Avg merge
1d 2h
Merged PRs (30d)
86

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from ionic-team/ionic-docs

All issues in ionic-team/ionic-docs

Similar issues

More Documentation issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.