Ambiguous Matches

If we have routes that look like:

• / : Our home page

• /notifications : Our notifications page

• /:handle : A users profile page

Do you see a problem here? What route should match if someone goes to /notifications ? The notifications components one? Or should it be though as a user who’s handle is notifications?

This is what we mean by ambiguous matches, fortunately, the Switch component we just saw that react-router provides us solves this problem for us too since it forces whatever route matches first to render and not the rest, so we just need to wrap our routes in a switch and make sure that our ‘wilder’ one is on the bottom so it only gets rendered if all the other ones don’t.