Vuetify: [Feature Request] v-data-table should expose select/expand in body slot and row click event

[nekosaur]

Problem to solve

One should have an easy way to use expand/select functionality when using body slot or click row event

Proposed solution

Add appropriate variables to the body slot scope, and the item event

[dasDaniel]

I've just had to do the same thing. Ended up documenting it here. https://dev.to/cactuslibratus/how-to-create-a-vuelify-data-table-that-has-only-some-expandable-rows-1m9m

the TL;DR; is that you need to use a variable that gets toggled in the slot

```html

````

exposing expand function and isExpanded Bool would be helpful (and select, isSelected,while we're at it?)

[austinginder]

I'm wondering if maybe the entire row should be clickable by default when using the expand functionality with data tables. This would better mimic how expansion panels works.

If not then I vote for an easy method to enable this functionality. Maybe a prop named expand-row which would turn the entire row into a clickable expand and collapse toggle.

[sourybunny]

Using the body slot along with expand-item seems to be problematic, It would be better if there is some way to use both together so that we can customize (clicking on a row should be expandable/collapsible) the table row.

[nekosaur]

@sourybunny that is outside the scope of this issue, and will not happen. The body slot will replace the internal rendering completely, since it allows you to specify the <tbody> section of the template. There is no way for the data-table to later insert the expanded-item slot content into the body slot content.

It is assumed that if you use the body slot you will be defining all of the behaviour of the table inside that slot, including potential expanded rows. Which is why it is important to have access to that state, and the reason this issue was created.