Hello friends, In this article, we will explain to you how to solve Matched leaf route at location “/” does not have an element in react. we will give you a simple example of how to solve Matched leaf route at location “/” does not have an element in React router.
When we use the following syntax in react-router v6.
1 | <Route path='/about' component={About} /> |
then we got the following types of errors.
1 2 3 | Matched leaf route at location "/" does not have an element. This means it will render an <Outlet /> with a null value by default resulting in an "empty" page. |
so we need to fix that error in reaction router v6. let’s try to understand that error. The reaction router changes in its packet library to reaction router v6. therefore, we cannot use a component prop in Route router v6 and we need to use element prop instead of component prop.
1 | <Route path='/about' element={<About/>} /> |