1.起初,错误的结果,角色直接展示的是id值,因为el-select会根据id自己匹配对应的中文label
2.我想做成效果是,
3.检查前端代码,没有问题
<el-form-item label="角色" prop="RoleId">
<el-select v-model="editManagerForm.RoleId" placeholder="请选择管理员的角色 " >
<el-option :label="item.Title" :value="item.ID" v-for="(item, index) in roleList" :key="item.ID"></el-option>
</el-select>
</el-form-item>
4.参照网上篇博客园后,找到了问题,是数据库格式问题,v-model中需要number类型值,我从后端接口拿到的是string类型,前端需要转换一下
https://blog.csdn.net/m0_47733490/article/details/120063226
但是后端也是自己写的,改后端接口快很多,我直接修改后端,默认返回Id为uint类型,就可以显示了;
如果需要前端解决,需要把v-model="editManagerForm.RoleId" 里面值转换为number类型
{
"data": {
"Manager": {
"CreatedAt": "2021-12-07T13:59:20.101+08:00",
"UpdatedAt": "2021-12-07T14:05:50.162+08:00",
"DeletedAt": null,
"ID": 18,
"Username": "刘成强17",
"Password": "$2a$10$H3doCfJyI8WdEBp9M4OcMu7Bn7zRs9Hblziei09AYVhsEJWru1dpC",
"Mobile": "18328632045",
"Email": "454905970@qq.com",
"Status": "1",
"IsSuper": "",
"RoleId": 2,
"Role": {
"CreatedAt": "2021-12-07T13:57:18.203+08:00",
"UpdatedAt": "2021-12-07T13:57:18.203+08:00",
"DeletedAt": null,
"ID": 2,
"Title": "技术开发",
"Description": "技术开发的描述",
"Status": "1"
}
},
"countManager": 1
},
"meta": {
"msg": "查询管理员信息成功",
"status": 200
}
}