Issue
This should have been simple but, when defining an interface with options
type:
options:
Array<{
title?: string;
options: Option[];
}>
| Option[];
I'm using map function to loop over the array, something like this:
{options.map((option) => (
<SelectPrimitive.Group key={option.title}>
Then I won't be able to access option.title, ts will say this title property doesn't exist. But the moment I remove the second part of the union:
options:
Array<{
title?: string;
options: Option[];
}>
It will work. Why doesn't ts understand that it's a union type, and instead it selects the second part of the union?
Solution
It actually understands that's a union type.
When using a union type A | B
it means that the object can be of type A
or type B
. TS
will do type checking taking into account both A
and B
. Common properties will work, but if a property is only on one type you need to narrow
the type.
That's where your error is coming from.
Answered By - Radu Diță
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.