Learning and sharing good experiences

VueJS - Dynamic State Management multiple instances

I am creating an app and I have a component "Message" which uses a store to get data back from a JSON file (this will be eventually a database) and the component is as follows: export default { ...

How can I strore the cytoscape object inside Vue.js data instance?

I am trying to use cytoscape.js within vue.js framework. I made a simple template and also have a variable cy in the data section. The in mounted() hook function I call cytoscape. Everything works ...

Changing SELECT options in Vue component

I'm using a Vue 2 component to implement a jQuery Chosen SELECT field. It's working OK, except that I need to be able to dynamically change the options list and it's not working as expected. This ...

How to dynamically inject a mixin into component

I have a component that requires a mixin depending on the props it receives. const timerMixin = { created() { console.log("Timer mixin injected") } } export default { name: '...

Vuelidate in vue Property "$v" was accessed during render but is not defined on instance

I am building a vue component containing form in an html file. Need to validate form using vuelidate library. Below warning is showing and validation is not working. [Vue warn]: Property "$v&...

CreateElement function of vue js doesn't return compeletly component

There is a situation which is I need to write a functional component for a specific cause. That is gets all of its children and adds some props to them. But the point is, I need to add those props to ...

How to keep alive Vue.Js components after routing from one page to another and back

I have two components named uploadSelfie.vue and takeSelfie.vue. In uploadSelfie.vue component, I am allowing user to upload 2 documents, his/her ID card copy and a selfie either by choosing from ...

Set initial model value if model is an array

How do I set the default value of a model if it is part of an array? new Vue({ data() { return { value: 1, values: [], products: [{ name: 'test 1', }, { ...

Vue js make nested component stay in parent when store updated

I am creating a chat messaging system, where I populate the store with root messages and then map the state of that list (array). When posting a new message the store gets updated and the new post ...

How to use v-if on a child component to be reactive to the parents attributes?

I have a Child component, which displays a warning message if the wrong dates from an Input are selected. This warning should only be possible in the Parent Component, because the Child is re-used ...

How to use <slot/> as the root element of a Vue component?

I'd like to build a wrapper component, that just adds some JavaScript to the actual component that is passed in, but without creating an extra HTML element. This works, but creates a div as the root ...

Creating multiple Vue components with internal router

Is it possible to use Vue Router to create internal navigation for components added via a for loop? ┌────────────────────────────────────────────────────────────────┐ │ ...

Open route in a sidepage using vuejs

I'm building a back office using Quasar. I would like to be able to open routes in what I would call a sidepage (for the lack of a better better word... maybe you have one?). Opening a route in this ...

Vue router 4 next() callback warning

I have unsucessfully been trying to fix this vue-router warning : The "next" callback was called more than once in one navigation guard when going from "/" to "/". It ...

Vue router - async scrolling not working correctly

I have problems implementing Vue Router's scroll behavior functionality. I have my homepage divided into smaller components(sections). So, If I go from one section of the homepage to another it works ...

Laravel + Vue project--[vue-router] Failed to resolve async component default: ChunkLoadError: Loading chunk dashboard failed

I am working on a Laravel and Vue project, at the moment of executing the server php run serve the project works normally, I can log in normally but, when I run the vue compilation command npm run ...

VueJS - Dynamic State Management multiple instances

How can I strore the cytoscape object inside Vue.js data instance?

Changing SELECT options in Vue component

How to dynamically inject a mixin into component

Vuelidate in vue Property "$v" was accessed during render but is not defined on instance

CreateElement function of vue js doesn't return compeletly component

How to keep alive Vue.Js components after routing from one page to another and back

Set initial model value if model is an array

Vue js make nested component stay in parent when store updated

How to use v-if on a child component to be reactive to the parents attributes?

How to use <slot/> as the root element of a Vue component?

Creating multiple Vue components with internal router

Open route in a sidepage using vuejs

Vue router 4 next() callback warning

Vue router - async scrolling not working correctly

Laravel + Vue project--[vue-router] Failed to resolve async component default: ChunkLoadError: Loading chunk dashboard failed

How to enter a particular filter via the route on which it is located

In Nuxt, how do you pass data from layouts to pages?

Laravel Vue add Vue-router to component

Can't use vue-router and pinia inside asingle a store

How to open a vuetify dialog using routes from vue router

Adding Jquery forms validate to vue3

How to run a VueJS application in ASP.NET core using NPM

Memory leak in Vue 3 with router and v-for

vuejs switch case

Getting : npm WARN using --force Recommended protections disabled

Vue sweetalert2

Vue signature pad

How can I use async/await in the Vue 3.0 setup() function using Typescript