enter image description here How I can create blocks like this? Of course I should use directive v-for to render items. But I have no idea how. And any masonry libs cant help me with that I used "@yeger/vue-masonry-wall" but…
I have a process which have many steps. Each one is implemented in a different component. Initially I had this code: <template> <template v-if="process.currentStep === 0"> <Step0 /> </template> <template v-else-if="process.currentStep === 1"> <Step1 /> </template> <template v-else-if="process.currentStep === 2">…
I'm using Laravel and Vue, in the blade template I'm calling a Vue component which I'm passing some props too, to try and be able to update the background image depending on window width: Blade Template: <component bg="{{ asset('/images/desktopBG.webp') }}"…
I've got a problem where I want a child component to call a function given to it as a prop from the parent. I have done it before with other components, but with this it just doesn't work. Here are…
This drove me insane, and I figured out a workaround. But I want to understand why it does not work in a straight forward way. Essentially, I have my main vue view, and a custom function I want to import.…
I have following v-text-field which has following defaults // defaults.ts (used by Vuetify) const INPUT_DEFAULTS = { color: '#8AB8E5', baseColor: '#8AB8E5', bgColor: '#E8F1FA', rounded: 't-lg', persistentHint: true } const defaults = { VTextField: INPUT_DEFAULTS } and these are the CSS…
I am trying to watch a computed value that gets filled up with messages from a store. This is it (code reduced for brevity): <div ref="RefWindow"> <ul v-for="Message in Feed"> <li>Message</li> </ul> </div> const Feed = computed(() => MyStore.Messages) const…
I am new to vue 3 and I am following some online vue 3 training:) so I get records back from the supabase database, the table the table gets populated with the exepected data. The last column has an action…
In Vue 3, when emitting an event from child to parent to update refs and subsequently refresh the props of the child the form control flow breaks i.e. tabindex or [tab]ing between fields doesn't work. My code is roughly setup…
I'd like to react to changes made to an array of template ref elements created with a v-for loop over some collection of arbitrary objects. I'd like to pass this array to a component / composable and have it react…