vue.js - 在 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: '',
...
}
}
解决方案
如何添加计算道具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>
推荐阅读
- javascript - ReactJS 下拉菜单,在打开当前菜单之前关闭其他菜单
- architecture - 我的微服务架构是否符合最佳实践?(STS/SPA/前端 API/后端服务)
- android - 如何在不知道哪个对话框的情况下关闭任何正在运行的对话框?
- c# - 如何使用 for 循环从文本框中的单选按钮值计算和显示平均成绩?
- mysql - mysql 喜欢所有单词的排列
- ms-access - 在 Access 中使用组合过滤无法正常工作
- python - 如何使 pylint 只计算没有默认值的参数?
- graphql - 为什么 GitHub Graphql 和 Yelp GraphQL 不允许多个 orderBy 字段?
- docker - dockerfile 是否有关于超级账本结构的基本映像的任何代码?
- python-3.x - 为什么我应该使用(y,x)而不是(x,y)来访问opencv中的像素?