Vue Select组件获取所选数组的值id

Question

我使用了 Vue Select 组件，我整天都在努力从选定的数组中获取 value id

<v-select multiple label="name" :on-change="consoleCallback" :options="option" :value.sync="option.id" :value="id" v-model="users_id">
</v-select>


import vSelect from 'vue-select'
export default {
        components: {vSelect},
        props: ['title'],
        data(){
            return{
                model: {
                    'title':'',
                },
                users_id:[],
                option: [],
methods: {
            fetchData(id){
                let vm = this;
                let dataInput = vm.model;
                axios.get('/subject/' +id+ '/edit',dataInput)
                    .then(function (response) {
                        Vue.set(vm.$data, 'model', response.data.model)
                        Vue.set(vm.$data, 'option', response.data.option)
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            },

enter image description here

Answer 1

查看 Vue Select 的 documentation，您应该使用 on-change 而不是 :on-change。文档中的 On-Change Callback 示例如下所示：

<v-select on-change="consoleCallback" :options="countries"></v-select>

和

methods: {
  consoleCallback(val) {
    console.dir(JSON.stringify(val))
  },

  alertCallback(val) {
    alert(JSON.stringify(val))
  }
}

Answer 2

Vue.set(vm.$data, 'model', response.data.model) → this.model = response.data.model

Answer 3

我知道它已经晚了，但是对于任何寻找答案的人，我在 github here 上找到了这个问题已经解决的线程。该组件有一个“index”道具，您可以将其设置为“id”以获取 id 值。

<v-select index="id" multiple label="name" :on-change="consoleCallback" :options="option" :value.sync="option.id" :value="id" v-model="users_id">
</v-select>