How can I check if react-router is in context?

Question

I'm migrating an AngularJS app to React little by little, and I would like to have a custom RouterLink React component that checks if react-router is in context so it can use history, and if not, falls back to usage of good old window.location. But I don't see any way of checking that in react-router's documentation.

I tried using withRouter but it throws when not in context and an ErrorBoundary doesn't seem to catch the error.

Does anyone know how I could go about doing this?

Answer 1

There is Router context exposed in react-router package, i.e. __RouterContext, by using that you can check if router is avaiable:

import React, { useContext } from 'react';
import { __RouterContext } from 'react-router';

const MyComponent = (props) => {
  const router = useContext(__RouterContext);

  if (router) {
    // Router context is avaible
  } else {
    // Use window.location as router context is not availble in this component
  }

  return <SomeOtherComponent />
}