React Router v6 中的前导可选路径参数

Question

In v5 I use next path regex:

/:locale?/:city?/mobile

In v6 it doesn't work. Tried to use array in path prop, but it doesn't supported

How I can refactor these in v6?

Answer 1

See this Github issue: https://github.com/remix-run/react-router/issues/7285

React Router v6 apparently doesn't support optional params anymore. Instead, you need to create a route per combination of params. In your case I think it may look something like this:

<Route path="/:locale">
    <Route path="/:city" element={<Page />} />
    <Route path="" element={<Page />} />
</Route>
<Route path="/:mobile" element={<Page />} />