Hi Folks
I have a list of urls to display, each with their own id, and the idea is to click on the url and it will open in a separate component. But when i try to get the id of the url using UseRouteMatch, i cannot get it to work. It never gets the value. It works fine in vanilla React.
This is the route
<Route path="/anecdotes/:id">
<Anecdote anecdote = {anecdote}/>
</Route>
The code to display the anecdote (individual) is here
const Anecdote = ({ anecdote }: any) => {
console.log('anecdote is ', anecdote)
return (
<div>
<h2>{anecdote.content}</h2>
<p>{anecdote.author}</p>
<p>{anecdote.info}</p>
<p>{anecdote.votes}</p>
</div>
)
}
The code to match the url is here
const match = useRouteMatch('/anecdotes/:id')
const anecdote = match
? anecdotes.find(anecdote => anecdote.id === (match.params.id))
: null
I get the error “Property id does not exist on type {}”. The id is for match.params.id. The same code works fine for react. match comes out as empty.
Does it have something to do with Ionic components? For example, wrapping the contents in IonPage or IonHeader?
Any help would be helpful, thanks.
2 posts - 1 participant