首页 > 解决方案 > 在 vueJS 中,如何在 v-select v2.5.1 中绑定所选选项的 Id

问题描述

我试图在 v-select 中获取所选选项的 id 已经有几个小时了,但它返回给我的是对象而不是 id。有没有办法只获取所选选项的 ID(对象 ID)?

我已经检查了文档站点: https ://sagalbot.github.io/vue-select/docs/

我还检查了各种示例: https ://codepen.io/collection/nrkgxV/

但到目前为止,我还没有找到解决我问题的具体方法。缺少什么或我做错了什么?

我的代码:

<template>
    <div>
        <v-select 
            v-model="selectedId"
            :options="items"
            label="name"
        ></v-select>
    </div>         
</template>

<script>
export default {
    data () {
    return {
        items: [
            {id: 1, name: "User 1", creator_id: 3},
            {id: 2, name: "User 2", creator_id: 1},
            {id: 4, name: "User 3", creator_id: 3},
        ],
        selectedId: '',
        ...    
        }
 }

标签: vue.jsvuejs2vue-componentjquery-select2vuex

解决方案


如何添加计算道具id

<script>
    export default {
        data () {
            return {
                items: [
                    {id: 1, name: "User 1", creator_id: 3},
                    {id: 2, name: "User 2", creator_id: 1},
                    {id: 4, name: "User 3", creator_id: 3},
                ],
                selectedId: {}  
            }
        },
        computed: {
            id: function () {
                return (this.selectedId && this.selectedId.id)?this.selectedId.id:'';
            }
        }
    }
</script>

推荐阅读