[Bug Report][3.7.6] VDataTable does not recognize v-model:options

[Sh4bbY]

Environment

Vuetify Version: 3.7.6
Vue Version: 3.5.13
Browsers: Chrome 131.0.0.0
OS: Windows 10, Linux

Steps to reproduce

In the reproduction example you can find 3 versions of a v-data-table.

• the first one does not recognize the v-model:options
• the second one triggers @update:options when initial options like v-model:page="options.page"
• the third one does work as expected but is quite buky

Expected Behavior

v-model:options should be recognized

Actual Behavior

v-model:options is not recognized

Reproduction Link

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

Other comments

Unfortunately I could not find any infomation about the exposed v-model: attributes of the v-data-table in the documentation. Therefore do not know if my bug report, maybe should be a feature request. It is working when every options property is specified and listened to individually, but this approach would be quite bulky. especially when used on every table.

My Intention is to save the page-options per page for every table on that page. When a user comes back to the page, the stored table props should be preset.

Why is there no documentation of the exposed v-model attributes? or was I just not capable of finding it?

[J-Sek]

When used like this:

@update:options="console.log('main',  $event)"

I get the logs upon interaction:

This is what I would expect after reading API docs. User interaction is required for this event to be triggered.

Your use case does not seem to require this event to be triggered right after table is mounted (without interaction), so it should be good enough (example - sorta the same as your middle version). You cannot simply bind all saved options to the :options prop because it is gone in v3. I don't think anyone from core team will be interested in introducing it back because of potential complications - props should not overlap.. but this is just my opinion here.

[Sh4bbY]

Thanks for the quick feedback 👍
I was not sure if :options is supported in v3.

My use case does require the @update:options event not to be triggered when there is no interaction.

I've created a - hopefully - better Example to make my point clear.

If :options is not supported in v3 (ExampleTable1) and the ExampleTable2 is working as expected, than I guess the issue can be closed. Maybe I should try to create a wrapper component for the v-data-table that can handle :options.

[J-Sek]

@Sh4bbY , I believe you are trying your best to explain your point, but there is either some detail about actually loading the data from persistent store during initialization or maybe you just need to step back and look from another angle.

Since your code already has "default" options defined, you don't need anything to be put in persistent storage - it would be redundant. If you somehow really need it... just add if (laded options from store are missing) { save defaults } or use second argument of useLocalStorage (from popular VueUse library) to set initial value.

To summarize, @update:options could trigger immediately to match other events more closely, but it would not solve any problem.. assuming I fully understand your use case. And since we agree on the behavior matching API docs, I am closing the issue.