how to use useParams inside a ContextProvider

I have something like this

return (
    <Router>
      <MyContextProvider>
        <Routes>
          <Route path="/" ...
          <Route path="/posts/:slug" ...

return (
    <Router>
      <MyContextProvider>
        <Routes>
          <Route path="/" ...
          <Route path="/posts/:slug" ...

and I want to access the slug on MyContextProvider on inital page load. useParams seems to always return an empty object 😦

2 Replies

goenningOP•2y ago

apparently useParams is only available from inside the <Routes>?

Bersaelor•2y ago

yes, I had this issue recently in my case, I was using params in a const handleButtonClick function which was also outside of tyeh context what helped in my case was to do

  const params = createMemo(() => useParams())
  const handleButtonClick = () => {
    if (params().value === ...) {
    // ...
    }
  }

  const params = createMemo(() => useParams())
  const handleButtonClick = () => {
    if (params().value === ...) {
    // ...
    }
  }

Gaming

Programming

how to use useParams inside a ContextProvider