【vuetify】v-select 无法正常显示,踩坑记录!

一、上代码

template

html 复制代码
<v-select
  v-model="editedUser.userRole"
  :items="roles"
  label="角色"
  item-value="value"
  :rules="[rules.required]"
></v-select>

script

javascript 复制代码
const editedUser = ref({
  userRole: 'customer' // 设置初始值为 'customer'
});

const rules = {
  required: value => !!value // 使用内置验证规则
};

const roles = [
  { text: '管理员', value: 'admin' },
  { text: '用户', value: 'customer' },
];

二、问题


三、解决

这是因为我没有写 item-title" ,加上去就好了

html 复制代码
<v-select
	v-model="editedUser.userRole"
	:items="roles"
	label="角色"
	item-title="text"
	item-value="value"
	:rules="[rules.required]"
></v-select>
相关推荐
专注前端30年2 分钟前
如何使用 HTML5 的 Canvas + JavaScript 实现炫酷的游戏得分特效?
前端·javascript·游戏·html5·canvas·canva可画
张丶大帅27 分钟前
JS案例合集
开发语言·javascript·笔记
helloyangkl1 小时前
前端——不同环境下配置env
前端·javascript·react.js
甜味弥漫2 小时前
JavaScript新手必看系列之预编译
前端·javascript
用户6600676685392 小时前
搞懂作用域链与闭包:JS底层逻辑变简单
前端·javascript
没落英雄2 小时前
简单了解 with
前端·javascript
小小弯_Shelby2 小时前
vue项目源码泄露漏洞修复
前端·javascript·vue.js
kaixin_啊啊3 小时前
HTML——表单类的标签【头歌educoder】
html·表单
小皮虾3 小时前
拒绝卡顿!小程序图片本地“极速”旋转与格式转换,离屏 Canvas 性能调优实战
前端·javascript·微信小程序
汤姆Tom3 小时前
前端转战后端:JavaScript 与 Java 对照学习指南 (第一篇 - 深度进阶版)
java·javascript