Learning and sharing good experiences

Changing parameter with vue 3 router route

Hi I was trying to change a router parameter of a vue router. My route is the following : /document/:id?/:lang?/edit Id and lang (language) being the parameters. I want to change the ...

How to make Vue 3 props objects reactive?

This code is from a VueMastery course, which must be outdated: export default { setup(props, {emit}){ let email = props.email; let toggleRead = () => { email.read = !email.read ...

Running Vue3/Vite with backend-ish node server

While I've seen plenty about SSR for Vue3/Vite, sadly it can't be that easy. Thanks to work's wacky saml setup, the authentication API breaks on the frontend, but can't sit on a separate domain, ...

Cannot play audio from Google Cloud Storage

Please help. I can not play my audio file. It is hosted in Google Cloud Storage, it works if I just rin it in a localhost server but when I use the uploaded one. I often get (failed)net::...

Vue + Element UI: (el-select) select an object option and pass value to multiple property

In Vue2 I got an array of objects OptionsArr [ { name: "apple" , price: 200 }, { name: "orange" , price: 150 } ] and an el-select: <el-select v-model="item....

Vue3 / Vuex State is empty when dispatching action inside of lifecycle hook inside of test

We're using the composition API with Vue 3. We have a Vuex store that, amongst other things, stores the currentUser. The currentUser can be null or an object { id: 'user-uuid' }. We're using Vue Test ...

Getting "export 'createStore' was not found in 'vuex' warning

I'm new to all these and now learning Vue. I have install Vuex, use export default, and import it but still getting this error => WARNING Compiled with 1 warnings warning in ./src/store/index.js &...

(Why) does .forEach() mutate vuex state?

I grab two sets of balances from my vuex state and merge them into a new array of entries. why is an error thrown when i iterate over my copies of the vuex state? am i missing something? .filter() ...

How to send and receive data between two Vue roots?

app.html <script defer src='app.js'></script> <script defer src='plugin.js'></script> <div id='app'></div> <div id='plugin'></div> app.js const ...

Error using nuxt and vuex : vuex.esm.js?2f62:1010 [vuex] mapGetters: mapper parameter must be either an Array or an Object [closed]

Im using nuxt and vuex . so far im having access to vuex the exact same way as docs told us to do, but in one page im getting this error : vuex.esm.js?2f62:1010 [vuex] mapGetters: mapper parameter ...

TypeError: Cannot read properties of undefined (reading 'day')

<div class="cont"> <ul> <li v-for="(value, key) in dayappointment.visit" :key="value"> {{ key }}: {{ value }} </li>...

How to sum total in table vuejs?

There are two rows of data row, <tr v-for="(data, index) in result_estimate.item_tabel" :key="index"> <td> <pre> sub total : {{ambilaja(formatPrice(...

How to use JSDoc to document `const z = (y) => (a, b = 3) => []`

I need to figure out a way to document the below function with JSDoc. /** * Return the collection from cache based on the hash, page and pagination count * @param state * @returns {function({hash: *...

VueX Store and multiuser system

I have no doubt this is explained and answered in various places, but I can't find it and have been given a very short deadline to find out. As I understand it, the point of the Store is to save you ...

Vuex store updating all instances, I only want current instance updated

I'm building a simple blog page where users can like and dislike comments. My current issue is whenever user hits "addLike", or "subtractLike" methods all the comment likes are ...

V-for not listing vuex state array objects because of Observer

I have a Vue 2.6 app with vuex, a vuex state variable called myVariableX which contains an array of objects. I'm retrieving its value from a backend API, saving it in vuex's state and using in ...

Using axios in Nuxt.js, but only delete is not getting a response

What I want to solve I am building an application using Nuxt.js. I was using axioms to communicate with Rails, but only the delete method is not returning a response. What is the cause? Also, what can ...

Dependency conflict with VueJS3 and Vuetify3

I have a VueJS 3 project with which I want to use Vuetify 3 (^3.0.0-alpha.0), however, upon adding Vuetify I started getting dependency conflicts. I also created a new empty VueJS 3 project with ...

Customising column sort order in v-data-table

I have an array auditResult(the data came from response.data.data) that have value like -internalID -fieldName -OldValue -NewValue I have a table <v-data-table :items="auditResults" :headers="...

Show tooltip in v-autocomplete drop-down items in vuetify 2.x

I'm working with vuetify 2.x and I want to know how to show a tooltip for each drop-down item of v-autocomplete. The drop-down has checkbox and textfield <v-autocomplete solo :items="..." ...

How do I search a Vuetify v-data-table column that is not in headers?

My Header: headers: [ { text: "Product Name", value: "name" }, { text: "Quantity", value: "quantity" }, { text: "Price", value: "price" },...

Headers in data-table(icons and few JSON )

To create a table, I want to use additional JSON - "tdTyp". Without data-table, I created a similar table using v-for and everything worked: <td>{{ td.status }}</td> <td>{{ ...

Time and Date picker type='datetime-local'

I have two text-field html elements to pick start and end date/time respectively. How to make start date/time less than end date/time? <v-text-field id="setTime" outlined type=&...

Vuetify breakpoints not working in Nuxt.js

I'm working on a project using Nuxt.js as SSR engine and Vuetify as styling framework. In one of my templates I have such code: <v-layout row wrap align-center :class="{ 'mb-4': $vuetify....

First 3456789101112 Last