I have a Vue 2 application that uses an array of objects to back a search/multiselect widget provided by vue-multiselect. I have looked at the Vue 1 -> 2 migration guide on debouncing calls, but the example they give did not propagate the arguments from the DOM elements to the business logic. Right now the select fires change events with
Tag: vuejs2
Vue.js event after condition element is rendered
I need event or some workaround how to access currently appended element with v-if in jQuery with $(“.myTarget”) if I use watch on showEl variable it triggers before element renders and I can’t access that element yet. How to achieve to be able to access .myTarget immediately after it renders? Answer Use $nextTick.
How to render .vue file in javascript when using ES5? (Trying to use webpack and vue-loader)
I have been trying to migrate a vue project and I unfortunately cannot use import/export in where I am building the application. Therefore, to simplify my problem, I created a project from scratch to build a vue component without the vue-cli. I have been successful to bring up the vue app with webpack before I created .vue files but after
Table sorting with index assignment
I have an array of objects: I use it as a model for a buefy table and at the same time, I’m using the extension sortable.js to manually order the table rows: The table is rendered correctly, but I need to update the order parameter on each manually sorting to reflect the real order o the table. For example, I
How to use Vuetify tabs with vue-router
I have the following jsfiddle that has two Vuetify tabs. The documentation doesn’t show examples on using vue-router with them. I found this Medium.com post on how to use Vuetify with vue-router, which has the following code: However, the code is now outdated as the Vuetify 1.0.13 Tabs documentation doesn’t specify a router prop in their api, so the embedded
How to avoid v-if on an element which uses v-for
I have a literal object like so: I was not aware that it was bad to use v-if inside a v-for loop and my first approach to display the code in the view was this: What I was trying to do is to avoid to display a div block related to the type property of the object MenuVoice. Since I
Getting index of a data in an array in VUE js
I want to change the status of Tasks when a particular method is called. But The problem is I cannot get the index of the particular item of the array to change its status. This is my HTML: And this is my Vue: I need make use of markComplete() and markIncomplete() but the problem is I couldn’t find the way
Vue Prop undefined in child component
I am trying to pass an array that inside an object from a parent component to a child component but answers is coming up undefined. When checking the prop in the parent component the data is there, but when it gets past to the child it is undefined. edit: Here is where the parent is declared Parent data: Query: Answer
Vue.js – Disable submit button unless original form data has changed
I have a simple form which I have created just for experiment purpose. I am trying to keep the button disable unless original form data is changed but still keep the button disabled if the data changes is reverted back to original data (undo). I found a jQuery solution here but I am looking for vanilla/vue javascript solution. Answer Here’s
vue js disable input if value hasn’t changed
I have an input with an initial value: However the disabled binding gives an error: Cannot read property defaultValue of undefined. Best way to do this without spamming vm.data too much? Answer The error: Cannot read property defaultValue of undefined Is because the ref is not available so soon: An important note about the ref registration timing: because the refs