Vue+ElementUI渲染select下拉框

User.java

/*实现getter和setter方法注解*/
@Data
public class User {private Integer id;private String name;
}

UserMapper.java

@Mapper
public interface CommonUserMapper {/**查询所有*/List<CommonUser> selectAllCommonUser();
}

UserMapper.xml

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapperPUBLIC "-//mybatis.org//DTD Mapper 3.0//EN""https://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.demo.mapper.CommonUserMapper"><select id="selectAllCommonUser" resultType="com.demo.domain.CommonUser">SELECT * FROM common_user</select></mapper>

UserService.java

public interface CommonUserService {/**查询所有*/List<CommonUser> selectAllCommonUser();
}

UserServiceImpl.java

@Service
public class CommonUserServiceImpl implements CommonUserService {@AutowiredCommonUserMapper commonUserMapper;/**查询所有*/@Overridepublic List<CommonUser> selectAllCommonUser() {return commonUserMapper.selectAllCommonUser();}
}

UserController.java

@RestController
public class CommonUserController {@AutowiredCommonUserService commonUserService;@GetMapping("/selectAllCommonUser")public Result selectAllCommonUser(){List<CommonUser> commonUsers = commonUserService.selectAllCommonUser();return Result.success(commonUsers);}
}
<template><div><el-dialog title="更新" :visible.sync="dialogFormVisible" width="40%"><el-form :model="form"><el-form-item label="姓名" label-width="15%"><el-select v-model="form.name" placeholder="请选择姓名" style="width:90%"><el-option v-for="item in names" :key="item.id" :label="item.name" :value="item.name"></el-option></el-select></el-form-item></el-form></el-dialog></div>
</template><script>
import request from '@/utils/request'
export default {data() {return {dialogFormVisible:false,form:{},names:[],}},// 页面加载时调用created(){this.getName()},methods:{getName(){request.get('/selectAllCommonUser').then(res=>{if(res.code === '200'){this.names = res.data}else{this.$message.error('查询失败')}})}}
}
</script>

JSON数据

{"code": "200","message": "请求成功","data": [{"id": 1,"name": "张三"},{"id": 2,"name": "李四"},{"id": 3,"name": "王五"},{"id": 4,"name": "赵六"}]
}

效果

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/422912.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

makefile 编译动态链接库使用(.so库文件)

makefile 编译动态链接库使用&#xff08;.so库文件&#xff09; 动态链接库:不会把代码编译到二进制文件中&#xff0c;而是在运行时才去加载&#xff0c; 好处是程序可以和库文件分离&#xff0c;可以分别发版&#xff0c;然后库文件可以被多处共享 动态链接库 动态&#…

支付宝:多线程事务怎么回滚?说用 @Transactional 可以回去等通知了!

1&#xff0c;最近有一个大数据量插入的操作入库的业务场景&#xff0c;需要先做一些其他修改操作&#xff0c;然后在执行插入操作&#xff0c;由于插入数据可能会很多&#xff0c;用到多线程去拆分数据并行处理来提高响应时间&#xff0c;如果有一个线程执行失败&#xff0c;则…

2011-2022年全国各地级市互联网普及率/互联网宽带接入用户数数据

2011-2022年全国各地级市互联网宽带接入用户数/互联网普及率数据 1、时间&#xff1a;2011-2022年 2、范围&#xff1a;包括295个地级市 3、指标&#xff1a;行政区划代码、年份、地区、互联网宽带接入用户_千户、常住人口数_千人、户籍人口数_千人、每百人互联网宽带用户_常…

续签KES证书

MiniO KES&#xff08;密钥加密服务&#xff09;是 MinIO 开发的一项服务&#xff0c;旨在弥合在 Kubernetes 中运行的应用程序与集中式密钥管理服务 &#xff08;KMS&#xff09; 之间的差距。中央 KMS 服务器包含所有状态信息&#xff0c;而 KES 在需要执行与获取新密钥或更新…

docker运行redis,jdk,nginx

Redis 1.查询redis [rootlocalhost ~]# docker search redis NAME DESCRIPTION STARS OFFICIAL redis Redis is an open source key-value store that… 12620 …

网络安全全栈培训笔记(WEB攻防-51-WEB攻防-通用漏洞验证码识别复用调用找回密码重定向状态值)

第51天 WEB攻防-通用漏洞&验证码识别&复用&调用&找回密码重定向&状态值 知识点&#xff1a; 1、找回密码逻辑机制-回显&验证码&指向 2、验证码验证安全机制-爆破&复用&识别 3、找回密码客户端回显&Response状态值&修改重定向 4、…

革新区块链:代理合约与智能合约升级的未来

作者 张群&#xff08;赛联区块链教育首席讲师&#xff0c;工信部赛迪特聘资深专家&#xff0c;CSDN认证业界专家&#xff0c;微软认证专家&#xff0c;多家企业区块链产品顾问&#xff09;关注张群&#xff0c;为您提供一站式区块链技术和方案咨询。 代理合约&#xff08;Prox…

地方债务余额数据,Shp、excel格式,2008-2020年,含公共财政收入、支出、负债率等多个字段

基本信息&#xff1a; 数据名称: 地方债务余额数据 数据格式: Shp、excel 数据时间: 2008-2020年 数据几何类型: 面 数据坐标系: WGS84 数据来源&#xff1a;网络公开数据 数据字段&#xff1a; 序号字段名称字段说明1zfzqsl地方政府债-债券数量(只)2zfzqye地方政府…

顶顶通呼叫中心中间件如何实现自己呼叫自己并且放音:一步步配置(mod_cti基于FreeSWITCH)

介绍 顶顶通呼叫中心中间件如何实现自己呼叫自己并且放音&#xff1a;一步步配置 一、配置acl.conf 打开ccadmin-》点击配置文件并且打开acl.conf-》配置好了点击提交XML。 注意&#xff1a;acl.conf的服务器IP必须是内网IP 添加了之后在运维调试输入reloadacl 在运维调试执…

w23靶场安装

一、实验环境 服务器&#xff1a;phpstudyv8.1.13 靶场&#xff1a;Bees二、实验目的 提供一个靶场环境 三、实验步骤 bees靶场安装 1.启动小皮的apache和mysql 2.在小皮V8.1.1.3版本上创建bees网站&#xff0c;选择的php版本最好在5.x&#xff0c;不然会有php解析错误。…

739.每日温度 496.下一个更大元素 I

739.每日温度 496.下一个更大元素 I 739.每日温度 力扣题目链接(opens new window) 请根据每日 气温 列表&#xff0c;重新生成一个列表。对应位置的输出为&#xff1a;要想观测到更高的气温&#xff0c;至少需要等待的天数。如果气温在这之后都不会升高&#xff0c;请在该位…

【Android】TypedArray的使用

介绍 看电池电量组件BatteryMeterView的时候看到的。 Array是个数组&#xff0c;所有TypedArray也是个容器&#xff0c;基本是用于自定义View里面的&#xff08;至少我目前见过的全部都在自定义View里面&#xff09;。 使用 1.自定义View public class RoundSeekbarView e…