I’m experiencing an issue with the v-navigation-drawer component in my Vuetify application. When the mini-variant.sync prop is enabled and the viewport is at a certain breakpoint (between lg and md), there is a strange padding appearing on the main part of the application. I have included my code above …
Tag: vuetify.js
How to change the checkbox colors of select component in Vuetify 3?
In Vuetify 3, I am using the select component (multiple mode). I want to change the color of the checkboxes. https://codepen.io/Sneaky6666/pen/RwJEePM?editors=101 You can see I set the color prop to red, but the checkboxes still show as black. How can I resolve this? JS Answer When you add props: {color:̵…
How to force collapse all expansion panels?
I want to force close my expansion panel when I clicked Update How do I programmatically do that ? This is what I have in my update(). Answer Expansion panels can be controlled externally by modifying the v-model. Its value corresponds to a zero-based index of the currently opened expansion panel content. If …
How to put variable in span or v-tooltip tag?
I’m using vue 2 with vuetify 2 and there’s occured a problem with displaying data from table. When I’m adding curly braces between v-tooltip tags I’ve getting blank page. Code example below. So I want to display that data from my list like I did in the rest of the code where’s is…
What is the best way to change a large number of data properties in vue?
Here is my data I have a calendar system where you can set the start and end of a day like so: I have created a function called copy so you can copy the day across all other days( so you don’t have to individually set each day) Obviously, this isn’t clean and wanted to know the best way of
How to show image on v-text-field?
enter image description here computed Result: my photo don’t wanna show on field enter image description here Answer should work for getting the correct URL. However, it won’t show inside the filed, if that’s what you’re trying to do. Text form inputs cannot contain images (other than …
Solved – Vue dynamically add style to :active pseudo class
HIGHLIGHT: This is a solved problem. Edit: Solved the problem using @Amaarockz’s advice! I haven’t had much experience in CSS variables & complicated :style structures, but turned out they’re great! Original question: I have a menu built with Vue.js (and Vuetify), data passed in from the…
TypeError: Cannot set properties of undefined (setting ‘message’) in Vue
i’m new in Vue.js, so there are concepts that maybe i’m missing. The thing is that i’ve been trying to do this for months, but i couldn’t get a solution. What i’m trying to do is change the message of a v-alert but on another js script, importing the variable of said message and …
Vuetify Table sortable column is not working
I have these vuetify table, this is how I configure the header As you can see I have sortable: true for Link Count column. Some how it is not working… How can I debug this further ? Answer By default, <v-data-table> comes with a sortable functionality for all the columns. By your question what I u…
I want to add two time limit conditions to the timepicker in Vuetify
What we want to achieve Is it possible to add two conditions to allowd-minutes in Vuetify? I have already added a condition to not show the time before now, but I would like to add another condition, I would like to be able to select m minutes only every 15 minutes. Is there a good solution? Code What we trie…