Skip to content

Instantly share code, notes, and snippets.

@donalmurtagh

donalmurtagh/gist:4ea3c35d94a212e333ecfb75c30f773e

Last active August 3, 2023 18:07
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save donalmurtagh/4ea3c35d94a212e333ecfb75c30f773e to your computer and use it in GitHub Desktop.
Save donalmurtagh/4ea3c35d94a212e333ecfb75c30f773e to your computer and use it in GitHub Desktop.
Download ZIP
Vuetify migration gotchas
Raw
gistfile1.md

  • the v-model of VFileInput is always an array of files. In v2 this was only the case if multiple file support is enabled

  • the item-key prop of VDataTable has been renamed to item-value . The old name seems like a better description of its purpose, so the reason for this change is a mystery

  • The return-object prop of VDataTable is buggy, approach with caution

  • The custom-sort prop of VDataTable has been removed. Currently in v3 there doesn't appear to be any way to implement a sort function that has access to multiple fields. Hopefully a replacement will be made available in future versions

  • The arguments passed to a VDataTable @click:row handler have changed (edited)

  • The argument passed to a VFileInput @change handler was the file(s), but now it's the DOM event. You can retrieve the file(s) via event.target.files

  • Any components with content that pops up/over will be teleported to the document body by default. To access this content in unit tests either disable the teleporting via the attach property

  • Attributes of form components such as VTextField or VFileInput don't get bound to the corresponding field, so given

The selector [data-cy="my-text-field"] would select the input field in v2, but in v3 the corresponding selector would be [data-cy="my-text-field"] input
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment