We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Vuetify Version: 3.5.7 Vue Version: 3.4.15 Browsers: Firefox 123.0 OS: Ubuntu undefined
Can't exactly reproduce on the playground.
If I do this in my own setup, the first example will render the following breadcrumbs:
{ "title": "foo" } / { "title": "bar" }
This clearly shows that the item has a key title.
item
title
The second example will render the following breacrumb (as expected):
foo / bar
But in {{ item.title }} the title will have a curly red underline indicating the following error:
{{ item.title }}
Property 'title' does not exist on type '"foo" | "bar"'. Property 'title' does not exist on type '"foo"'.ts-plugin(2339)
I'm using VSCode with the official plugin.
So this seems to be a typing issue.
The complete type definition for item in the template (shown by VSCode on hover) is
(property) item: ((arg: { item: BreadcrumbItem; index: number; }) => VNode<RendererNode, RendererElement, { [key: string]: any; }>[]) & ((arg: { item: "foo" | "bar"; index: number; }) => VNode<...>[])
So I would expect it to use BreadcrumbItem type.
BreadcrumbItem
I tried to cast it as BreadcrumbItem but didn't find any way to get that type :-(
TS - once again - causes way more problems than it solves.
A third example shows how explicitly creating the item object fixes the TS error. But this is overhead code that should not be necessary.
https://play.vuetifyjs.com/#...
The text was updated successfully, but these errors were encountered:
Might be related to #15371
Sorry, something went wrong.
fix(VBreadcrumbs): item types for slots (#19341)
756331e
fixes #19339 Co-authored-by: Son Tran <stt@cct-technology.com>
Thanks a lot for the fix! <3
Successfully merging a pull request may close this issue.
Environment
Vuetify Version: 3.5.7
Vue Version: 3.4.15
Browsers: Firefox 123.0
OS: Ubuntu undefined
Steps to reproduce
Can't exactly reproduce on the playground.
If I do this in my own setup, the first example will render the following breadcrumbs:
This clearly shows that the
item
has a keytitle
.The second example will render the following breacrumb (as expected):
But in
{{ item.title }}
thetitle
will have a curly red underline indicating the following error:I'm using VSCode with the official plugin.
So this seems to be a typing issue.
Expected Behavior
The complete type definition for
item
in the template (shown by VSCode on hover) isSo I would expect it to use
BreadcrumbItem
type.I tried to cast it as
BreadcrumbItem
but didn't find any way to get that type :-(Actual Behavior
TS - once again - causes way more problems than it solves.
Comment
A third example shows how explicitly creating the
item
object fixes the TS error. But this is overhead code that should not be necessary.Reproduction Link
https://play.vuetifyjs.com/#...
The text was updated successfully, but these errors were encountered: