Provide a minimal example

[cj-prog]

Hello. I wonder if vuetify-tree-data-table is a similar project to vue-ads-table-tree (vue-ads-table-tree).

When I take a simple table (https://vuetifyjs.com/en/components/data-tables#usage--1) and make it a v-tree-data-table, I get the following warning and no shown rows:

vue.runtime.esm.js:582 [Vue warn]: Error in callback for watcher "items": "TypeError: Cannot read property 'forEach' of undefined"

I think your project has a good potential and I would be happy if you could provide a minimal example

[russ1985]

Hey There,

Sorry for the late reply. Been busy on some customer projects.

Really excited that you want to give it a try. The one you sent over is similar but I think ours has a couple more features such as DnD.

I will work on a standalone example that you can run, right now its running in our codebase and I just wanted to publish the base code and didn’t get a chance to build a standalone example yet but will try to do that in the next few days.

Thanks,

Russell

On Nov 9, 2018, at 2:15 PM, cj-prog notifications@github.com wrote:

Hello. I wonder if vuetify-tree-data-table is a similar project to vue-ads-table-tree (vue-ads-table-tree https://www.npmjs.com/package/vue-ads-table-tree).

When I take a simple table (https://vuetifyjs.com/en/components/data-tables#usage--1 https://vuetifyjs.com/en/components/data-tables#usage--1) and make it a v-tree-data-table, I get the following warning and no shown rows:

vue.runtime.esm.js:582 [Vue warn]: Error in callback for watcher "items": "TypeError: Cannot read property 'forEach' of undefined"

I think your project has a good potential and I would be happy if you could provide a minimal example

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/portablemind/vuetify_tree_data_table/issues/1, or mute the thread https://github.com/notifications/unsubscribe-auth/AAce5emIgtkfPctAHtvJ47FKo_4DZBNcks5utdRcgaJpZM4YXXJj.

[russ1985]

I have added an example and updated the docs. You can try the example by cloning the repo and loading the index.html page in a browser.

Let me know if you have any questions / issues.

Thanks!

[cj-prog]

Hi,

Thank you so much for your trouble. The example works well, but unfortunately I can't apply it to my table. When I change an existing v-data-table to v-tree-data-table, no rows are displayed. I can imagine that it is due to the structure of the items. Can you please provide a concrete example of this?

I have set up a sandbox: https://codesandbox.io/s/oxkp4nm04z

If I use the v-data-table here, it works, with the v-tree-data-table it doesn't work. Maybe you just change the example so that it works?

Thanks a lot!

Translated with www.DeepL.com/Translator

[russ1985]

Hey There,

I got it working.

Made a few updates

1. Added id and depth attributes to the data
2. Updated the desserts data attribute to be set via the load method which is the event emitted by the tree when it is ready to load the items
3. Updated the headers to remove duplicate keys of empty strings “ “
4. Updated the slot to use row instead of items. I have to use a "row" slot because the tree-views renders the row and adds the DnD td column. So it has to control the actual tr tag.

https://codesandbox.io/s/mo16ql4klx https://codesandbox.io/s/mo16ql4klx

That one should work.

Let me know if you have any questions.

Thanks,

Russell

On Nov 21, 2018, at 2:34 PM, cj-prog notifications@github.com wrote:

Hi,

Thank you so much for your trouble. The example works well, but unfortunately I can't apply it to my table. When I change an existing v-data-table to v-tree-data-table, no rows are displayed. I can imagine that it is due to the structure of the items. Can you please provide a concrete example of this?

I have set up a sandbox: https://codesandbox.io/s/oxkp4nm04z https://codesandbox.io/s/oxkp4nm04z If I use the v-data-table here, it works, with the v-tree-data-table it doesn't work. Maybe you just change the example so that it works?

Thanks a lot!

Translated with www.DeepL.com/Translator http://www.deepl.com/Translator — You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub https://github.com/portablemind/vuetify_tree_data_table/issues/1#issuecomment-440784798, or mute the thread https://github.com/notifications/unsubscribe-auth/AAce5SYZvlkbvIMgI91DtmhcM_f5UUt7ks5uxaqqgaJpZM4YXXJj.