Vuetify: [Feature Request] V-Tree-Table object is needed

[SGarno]

Problem to solve

There are a lot of applications for a data table which has hierarchical groupings but still retains the tabular columns. It is a blend of v-tree-view and v-data-table, to become a v-tree-table.

I am posting this as a separate feature request, but it is somewhat related to issue #3180. However, I believe it is different enough, and perhaps even encapsulates the functionality that a grouped data table provides. With a v-tree-table, the grouped table may not be needed(??)

Proposed solution

Look at https://docs.webix.com/desktop__treetable.html#apireference as an example of what functionality it provides as well as an API. It is certainly not "vuetified" but it might give some good ideas as to how to implement.

[nekosaur]

It is very unlikely that we would develop something like this for inclusion in core vuetify. It might be possible to make some version of it in user land with the upcoming 2.0 data-table, although there are no guarantees.

[morficus]

+1 for having this as part of Vuetify
here is another example: http://tabulator.info/examples/4.2?#tree

I 100% agree that this is quite different from having row-groups, since having a tree-like structure implies the data is hierarchical (and could have multiple levels) while grouping is simply taking a single dimension and joining it by common values.

[ifiri]

If I or someone will propose you pull-request with working component, will you include this component in the Vuetify? Just for use it out-of-box instead of using third-party component.

[aalopatin]

It's a very useful function. I really need this opportunity. I am trying to find a UI framework with hierarchical tables. I wanted to switch to Vuetify with Bootstrap + Tabulator, but it turned out that it does not have the ability to make hierarchical tables.

[Threnos]

Looking forward to this feature.

[walteriusGO]

View this link https://github.com/portablemind/vuetify_tree_data_table

[zyxel648]

View this link https://github.com/portablemind/vuetify_tree_data_table

This plugin for vuetify version 1.x 😒

I'm also looking for tree-table component for vuetify 2.x

[guykatz]

I think this is a much needed component...
TBH, in my field of applications this is probably the MOST needed component of all.

[alishanster]

Having such component out-of-box would be great indeed!
Can anybody recommend any work-arounds for such treeview table?

[JeanPerriault]

Same as @alishanster, I would like to find recommendations on work-arounds. I can see that libraries like "angular material", and even "material design system", don't propose/describe this kind of component. Is that because it is too complex to use (I sometime think this is the case)?. Anyway, can't find any guidance on how to replace this.
Should we propose first a tree to drill down, then once a leaf is selected propose a form to modify item attributes? How do you mass update in this case?
Thx for any useful thoughts or links on this.

[SGarno]

It is a fairly complex component, but for that reason, I think it should be part of the framework. I have seen a number of implementations and (in my opinion) the only one that truly works well is one that is based on a flat list of nodes where the visual part is a view into the dataset, as opposed to one that uses a hierarchical dataset (i.e. Child nodes).

As the node list gets large, you can just render a view on the flat list and allow data to be loaded incrementally. Doing the same thing in a Child node style approach fails miserably in performance, and you can't sort/search/filter easily across the hierarchically structured nodes.

I don't know if this is something that the Vuetify feels is important (in the grand scheme of things they have on their list to accomplish), but I certainly would greatly welcome this component to the list. :-)