Initializer provides no value for this binding element and the binding element has no default value

Issue

I have the typescript error above. Here is my line of code

const {params:{guid} = {}} = useRouteMatch('/navigate/poi/:guid') ?? {}

Basically I'm destructuring the url. Using params and all works, just typescript complains with the error above when I hover over guid. I read through the other questions related to this, but I could not figure it out so far. Thanks for reading!

Solution

In your code, you're setting params to {} which doesn't contain guid when destructured. You have to do it like this:

const {params:{guid} = {guid: /*Default Value*/}} = useRouteMatch('/navigate/poi/:guid') ?? {}

Replace /*Default Value*/ with whatever you want guid to default to (e.g. '' or undefined.)

Answered By - user5664615