vue select 绑定复杂数据和默认显示
- 前端
- Caomeinico
- 0
<div>
<v-btn class="error" @click="btn">测试</v-btn>
<v-select
id="list"
v-model="sortBy"
:items="itemSortBy"
placeholder="Sort By"
solo
hide-details
dense
class="rounded-lg"
color="primary"
item-text="text"
item-value="values"
>
<template #item="{ item }">
<p class="selection-item ma-0">
<v-icon small class="mr-3">
{{ item.icon }}
</v-icon>
<span>
{{ item.text }}
</span>
</p>
</template>
</v-select>
</div>
</template>
<script>
export default {
data() {
return {
search: "",
sortBy: '361',
itemSortBy: [
{
text: "张飞",
values: '360',
},
{
text: "赵云",
values: '361',
},
],
items: [],
loading: false,
options: {
page: 1,
},
tab: "all",
totalItem: 10,
totalPage: 1,
rowsPerPageItems: [10, 20, 50, 100],
doubleClickPrevent: false,
};
},
methods:{
btn(){
console.log(this.sortBy);
}
}
};
</script>
<style></style>更多建站及源码交易信息请见 好买网 GoodMai
免责申明：本站发布的内容（图片、视频和文字）以转载和分享为主，文章观点不代表本站立场，如涉及侵权请联系站长邮箱：xbc-online@qq.com进行反馈，一经查实，将立刻删除涉嫌侵权内容。
