Как переписать такой код на React Router V6?

Question

[Nekdev]

Есть такой код, с использованием render-функции. В v6 react-router, эти функции и component были заменены на element. Как тогда переписать данный код на новый стандарт?

Сейчас в консоль выезжает ошибка: "Matched leaf route at location "/users/4" does not have an element. This means it will render an with a null value by default resulting in an "empty" page."

Код:

<Route path='/users/:id' render={({match, location, history}) => {
                       const { id } = match.params;
                       return <UserDetails userId={ id } />}}/>

Answer 1

[Alexandroppolus]

import { Routes, Route, useParams } from 'react-router-dom';

const UserDetailsPage = () => {
	const { id } = useParams();
	return <UserDetails userId={ id } />}}/>
}

<Route path='/users/:id' element={<UserDetailsPage />}/>

Comments

[Nekdev]

Спасибо, работает!