`react-router` is not convenient to use. Alternatives for the `react-router`

Ionic Framework Ionic React
1

IonReactRouter uses react-router library under the hood and its functionality rather limited.

react-router does not provide ability to return back to some page from navigation stack by its pathname. Instead you need to count difference between current page and the page where you want to turn back by yourself and call history.go(-n). (It’s also does’t works well bug: react, router.go does not show correct view when n < -1)

IonReactRouter does not allow removing pages from the navigation stack (and DOM) except through history.go()/goBack()/replace(). It seems useful to remove pages from custom parts of the navigation stack too.

For example I checked the documentation for the react-navigation router for React Native apps and founded such useful features as:

  • navigation.navigate('RouteName') pushes a new route to the native stack navigator if it’s not already in the stack, otherwise it jumps to that screen.
  • You can go back to the first screen in the stack with navigation.popToTop() .

Are there any alternatives for the react-router library in Ionic apps?
Does anyone know if there are any plans to add new methods for work with the navigation stack in the React Ionic roadmap?

2

React Router has a major new release (v6); Ionic currently only supports v5. There is a feature request to update Ionic to use v6.

I think it’s unlikely that Ionic would shift away from react-router because it is the most popular React routing package. If you’re not satisfied with the navigation features provided by react-router, it might be better to work to add the features in react-router itself, since IonReactRouter is basically just a wrapper for react-router.

1 Like