Questions tagged [vuetify.js]

Vuetify.js is an open source framework for building user interfaces for Vue.js 2 and 3. Use this tag for questions specific to Vuetify components and API. (If possible, provide a CodePen or JsFiddle item reproducing your issue.)

8866 questions
28
votes
2 answers

Vuetify : throttle / debounce v-autocomplete

I'm using the Vuetify Autocomplete with remote data, and I would like to to throttle / debounce the API calls (wait 500 ms to call the API when the user is typing text in the autocomplete). How can I do that? I saw a Stack OverFlow post about the…
Ricou
  • 946
  • 3
  • 11
  • 22
28
votes
6 answers

Removing Margins and Padding within Vuetify

So I'm pretty much brand new to Vuetify and Front End development, so sorry if my question is either simple or maybe even too vague. I'm trying to build a website with Nuxt and Vuetify, but I'm having an issue with removing the padding around the…
Phil Robinson
  • 427
  • 1
  • 4
  • 12
28
votes
2 answers

Make element visible only for md sized devices

according to https://vuetifyjs.com/en/layout/display you can hide for a specific device size or range going up or down. But how would you show a div only for md sized devices? hidden-lg-and-up hidden-sm-and-down doesn't seem to work. concatenating…
Martin
  • 1,112
  • 1
  • 11
  • 31
27
votes
8 answers

vuetify.js how to get full width of v-container

I'm new to vuetify.js and started playing around with it. This is my code. Admin-panel.vue
margherita pizza
  • 6,623
  • 23
  • 84
  • 152
27
votes
6 answers

DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead

I tried to run the Vuetify VueJS Cordova example but got this error after npm run dev node build/dev-server.js Starting dev server... (node:1024) DeprecationWarning: Tapable.plugin is deprecated. Use new API on .hooks instead (node:1024)…
Tom
  • 5,588
  • 20
  • 77
  • 129
26
votes
1 answer

vuetify v-col xs="12" only fill half the width

I am wondering why vuetify breakpoints are not working on when screen size is <600px new Vue({ el: '#app', vuetify: new Vuetify(), })
Ravi Anand
  • 5,106
  • 9
  • 47
  • 77
26
votes
5 answers

How to bottom align button in card, irrespective of the text in vuetify?

I am trying to align button in my cards. I have a layout which contains 3 cards in a row. But, the problem is, when i add text in the card the position of the button changes in the specific card. I have tried passing different props and tried using…
abhigyan nayak
  • 1,394
  • 6
  • 25
  • 35
26
votes
2 answers

How to use mask in vuetify text-field?

I'm trying to use the mask property of text-field component, like the example below. In the view, that works like a charm, but, when the form is posted, the mask format does not keep the value. For example, when I type "000.000.000-00", the value…
Marcelo Júnior
  • 435
  • 1
  • 5
  • 11
25
votes
4 answers

How does one style a specific row on v-data-table? [Vuetify]

All I'm trying to do is for the given row that contains an entry that is equal to lowestEntry, change the background color.
Ricardo F.
  • 496
  • 1
  • 4
  • 11
25
votes
6 answers

Vuetify remove pagination on v-data-table

I want remove pagination on v-data-table,use hide-default-footer but it doesn't work. try to use hide-dafault-footer
gold three
  • 661
  • 1
  • 8
  • 10
25
votes
2 answers

Vuetify text color variants

I want to use one of the color variants for text, how can I do this? I have tried:

My Address

My Address

My Address

and many other…
Brad
  • 8,044
  • 10
  • 39
  • 50
25
votes
6 answers

Vuetify - How to trigger method when clear a v-text-field

is there a way to call a method while clearing a text-field with Vuetify?
Francis Beaulieu
  • 353
  • 1
  • 3
  • 5
25
votes
7 answers

Vuetify: How to preselect active tab?

I want to use Vuetify (v1.0.18) to render some static navigation using v-tabs. The routing is done on the server side, so I need a way to set the active tab by properties. It's a very basic task, but I don't get it to work. Example:
Georg Ledermann
  • 2,712
  • 4
  • 31
  • 35
25
votes
2 answers

How to implement a simple form with validation in a Vue app (with Vuetify.js)?

I'm trying to add a contact form with simple validation on a website built with Vue.js using a Vuetify.js example. I'm a newbie, so I'm not sure how it should be implemented in a Vue component. I want to achieve a simple client side form validation…
Un1
  • 3,874
  • 12
  • 37
  • 79
25
votes
5 answers

How to call a function on append-icon click in Vuetify.js?

I need the append-icon="close" to call @click="clearSearch()" Right now I'm implementing it with a dedicated button:
Un1
  • 3,874
  • 12
  • 37
  • 79