i have a vertical list of items, each of which can be removed. I put my items inside a transition-group and created simple opacity and transform transitions for them. The transitions on the removed elements work as expected, however if I remove an element which is not placed at the bottom, the ones beneath ju…
Tag: vuejs2
How to tell if a Vue component is active or not
I have a Vue component that is wrapped in a <keep-alive> tag to prevent re-rendering. Within the component, I want to react to some change in global data by firing a method. But, I only want to fire the method if the component is currently active. Right now, I’m doing something like this: But I wa…
Detecting keyboard button and play sound in vue.js
The code below actually plays sounds on each button click with vue.js. How is it possible to detect keyboard press and play sound when DOM is ready and not when the buttons are clicked? for example on enter play sound v-on:keyup.13=”playSound(‘path/to/mp3’)” Vue documentation mostly ex…
How to emit an event from Vue.js Functional component?
As the title of the question, this context is not available in the functional component. So if I have to emit an event, how can I do that? For example in below code snippet: My functional component doesn’t have this context and hence $emit is not available. How can I bubble-up this event? Answer This is…
how to resolve – Duplicate presence of slot “default” found in the same render tree
I am getting the below error when using <slot> multiple times: Duplicate presence of slot “default” found in the same render tree – this will likely cause render errors. There are solutions that use “scoped slots” but what I understand is that it’s good to use those w…
Cannot remove element from array of components (slice, Vue.js)
I’am trying to implements dynamic adding and removing components in Vue.js. There is a problem with slice method, basically it should remove element from array by passed index. To mutate an array i use slice(i,1) . According to this answer, modifying array in this way should help me, but is’s not …
Using Vue.set in object with multiple nested objects
I am trying to use Vue.set() to update a state object in Vue 2. This is what the object looks like: So far, I was updating it with this mutation. I’m mutating each entry separately because they have different content. Now, I’m trying to implement Vue.set() to avoid a change detection caveat. My pr…
vue transition mode=”out-in” returns a ref element as undefined
So this is an issue when mode=”out-in” is applied as in <transition mode=”out-in”> a ref’d element returned undefined during the updated lifecycle. However, without the mode=”out-in” it works as expected. How can I resolve this? https://codesandbox.io/s/mjy8jr41…
VueJS prop is undefined when read in data() method
I’m having trouble understanding how props work in VueJS, some help would be greatly appreciated. It is a simple google map component that I wish to show on the page and pass the id element of the div dynamically as a prop to the underlying template. html file – vue file – The error I get is…
Getting first element of Observer Array
Hi dear friends, i cannot get first element or data etc. I did try notes[0] but the result was ‘undefined’. What kind of array is this? First time i’ve seen and i am using Vue.Js Answer You can access the first element simply using Array.from: Also, {__ob__: Observer} is a special property a…