Skip to content
New issue

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

[Bug Report][3.6.7] Treeview wrong slots in documentation #19907

Closed
b4rthm opened this issue May 27, 2024 · 3 comments
Closed

[Bug Report][3.6.7] Treeview wrong slots in documentation #19907

b4rthm opened this issue May 27, 2024 · 3 comments
Assignees
Labels
C: VTreeview VTreeview T: bug Functionality that does not work as intended/expected

Comments

@b4rthm
Copy link

b4rthm commented May 27, 2024

Environment

Vuetify Version: 3.6.7
Vue Version: 3.4.27
Browsers: Chrome 125.0.0.0
OS: Windows 10

Steps to reproduce

change prepend slot to label slot.

Expected Behavior

the labels are replaced with icons

Actual Behavior

Property 'label' does not exist...

Reproduction Link

https://play.vuetifyjs.com/#...

Other comments

The label slot seems so be renamed to the title slot. The documentation needs to be adjusted.
https://vuetifyjs.com/en/components/treeview/#append-and-label
image

@yuwu9145 yuwu9145 self-assigned this May 30, 2024
@yuwu9145
Copy link
Member

Documentation is wrong, but also prepend slot doesn't return open so folder icon doesn't change to "open folder" when expanding.

@yuwu9145 yuwu9145 added T: bug Functionality that does not work as intended/expected C: VTreeview VTreeview and removed S: triage labels May 30, 2024
@pciavald
Copy link

It seems the slots are only used for leaf items, and there does not seem to be slots for groups. As you can see here only empty folders behave correctly

  <v-treeview
    ref="treeview"
    class="treeview"
    active-class="treeview-active"

    return-object
    activatable
    hoverable

    :items="nodes"
    item-children="nodes"
    item-value="path"
    item-title="label"

    density="compact"
    :selected="selected"

    @update:activated="select"
  >
    <template v-slot:prepend="{ item }">
      <v-icon>
        {{ item.open ? 'mdi-folder-open' : 'mdi-folder' }}
      </v-icon>
    </template>

    <template v-slot:item="{ item }">
      <div>
        {{ item.value }}
      </div>
    </template>

    <template v-slot:append="{ item }">
      <div class="append_bold">
        {{ item.count || 0 }}
      </div>
    </template>

  </v-treeview>

image

@yuwu9145
Copy link
Member

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
C: VTreeview VTreeview T: bug Functionality that does not work as intended/expected
Projects
None yet
Development

No branches or pull requests

3 participants