Add slot for the item text itself

[Employee87]

I see there is a slot for before and after. But what if I want to replace the actual text itself to some template code?

[N00ts]

that could be a good idea, you can propose a P%R if you want :)

[Employee87]

@N00ts I made the pull request, please check and merge, thanks.

https://github.com/N00ts/vue3-treeview/pull/34

[N00ts]

Hey what is exactly the use case ? Can't you use existing slots ?

[Employee87]

It's because by default the code will always take the text prop and show it in the treeview main text area. But for example I wanted to replace that with a highlight plugin like <highlight :search="search_text" :value="node.text" /> (which highlights part of the content based on the search text), and since I can't override the main text, I have to set text prop to empty string so that nothing shows in the main text area, and override the before or after slots with this highlight component. I then have to make a new property like text2 to use for the actual text. Plus I then have to inject some custom css to remove the margin around the main text area.

This could all be solved, if I have a slot for the main text area.

[N00ts]

Why not just a custom class ?

[Employee87]

I am not sure how that would help me though? Does the main area (i.e. not the before or after area) have a prop to insert a custom class?

[scscgit]

Another use-cases:

• Adding an id to uniquely identify each node for test automation purposes, including whether it's a leaf node or not
• Adding a title property

Isn't this slot a most basic feature users of a tree view would expect?

[dustin-auby]

This would help in many situations, i want to add tool tips to the nodes and would need to have a custom slot for the text to do this.

[MrAmine08]

How about making the label clickable? and not just the checkbox.