【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>
相关推荐
拉不动的猪21 小时前
# 关于初学者对于JS异步编程十大误区
前端·javascript·面试
Larcher21 小时前
新手也能学会,100行代码玩AI LOGO
前端·llm·html
小月鸭1 天前
如何理解HTML语义化
前端·html
yivifu1 天前
JavaScript Selection API详解
java·前端·javascript
这儿有一堆花1 天前
告别 Class 组件:拥抱 React Hooks 带来的函数式新范式
前端·javascript·react.js
BBB努力学习程序设计1 天前
CSS Sprite技术:用“雪碧图”提升网站性能的魔法
前端·html
Zyx20071 天前
深拷贝:JavaScript 中对象复制的终极解法
javascript
BBB努力学习程序设计1 天前
CSS3渐变:用代码描绘色彩的流动之美
前端·html
开发者小天1 天前
React中的componentWillUnmount 使用
前端·javascript·vue.js·react.js
sunly_1 天前
Flutter:视频预览功能
javascript·flutter·音视频