question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[feature request] add tag attribute to v-select component and on-change callback

See original GitHub issue

while trying to use v-select in a for in loop, there is no way i can distinguish which $index emited the on-change callback.

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Reactions:1
  • Comments:14 (4 by maintainers)

github_iconTop GitHub Comments

21reactions
simevocommented, Jun 21, 2017

Here is a way around this one; for our model:

{ feeds: [{id:1, tags:['a']}, {id:2, tags:['a', 'b']}] }

the markup is:

<div v-for="f in feeds" v-bind:key="f.id">
  <v-select
    :on-change="function(val) { tagsChanged(f.id, val); }"
    multiple
    :options="['a', 'b', 'c']"
    value='f.tags'></v-select>
</div>

This supplies an anonymous function with the signature required by onChange, which passes the new value val and the id from the model to a separate tagsChanged function

Don’t forget to define a global tagsChanged function or one inside the Vue app it it has to access the model.

2reactions
sagalbotcommented, Jul 18, 2016

Both very good suggestions. I’ll work on this for an upcoming release.

Did you have an API in mind for distinguishing v-selects?

Read more comments on GitHub >

github_iconTop Results From Across the Web

vue.js - How do I watch for onChange of specific select menu ...
The operator menu is dynamically populated based on API based on the selected attribute. I have v-model="form.values.attributes" , and my watch ...
Read more >
Select component — Vuetify
The v-select components can be optionally expanded with prepended and appended items. This is perfect for customized select-all functionality.
Read more >
Vue-Multiselect | Vue Select Library
In this example, the addTag method generates an object with a unique code property. Optional configuration flags: tag-placeholder="Add this as new tag" –...
Read more >
How to Use @change in Vue with select Tags - Mastering JS
In every option tag, you must set the value property to define the value of each option. Vue event handlers have a special...
Read more >
simple-vue-select - npm Package Health Analysis - Snyk
Vue.js component that provides functionality to selects without the overhead of ... in which case you'll need to use * the onChange callback...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found