登录/验证码/注册

登录

pom文件
        <!--hutool工具类--><dependency><groupId>cn.hutool</groupId><artifactId>hutool-all</artifactId><version>5.8.9</version></dependency><!--jwt--><dependency><groupId>io.jsonwebtoken</groupId><artifactId>jjwt</artifactId><version>0.9.1</version></dependency>
控制器
    @ResourceAppUserService appUserService;@ResourceJwtUtils jwtUtils;/*** 登录* @param loginDto* @return*/@PostMapping("/login")public Result login(@Validated @RequestBody LoginDto loginDto){// 校验用户名密码AppUser appUser = appUserService.login(loginDto);// 生成tokenString token = jwtUtils.generateToken(appUser.getId());return Result.success(MapUtil.builder().put("token", token).put("userInfo", appUser).build());}
service实现类
    @Overridepublic AppUser login(LoginDto loginDto) {AppUser appUser = this.getOne(new QueryWrapper<AppUser>().eq("username", loginDto.getUsername()));// 校验用户名和密码Assert.notNull(appUser, "用户名或密码错误");Assert.isTrue(appUser.getPassword().equals(SecureUtil.md5(loginDto.getPassword())), "用户名或密码错误");// 更新最后登录时间appUser.setLastLogin(LocalDateTime.now());this.updateById(appUser);return appUser;}
JwtUtils 工具类
@Slf4j
@Data
@Component
@ConfigurationProperties(prefix = "jwt")
public class JwtUtils {private String secret;private long expire;/*** 生成jwt token*/public String generateToken(long userId) {Date nowDate = new Date();//过期时间Date expireDate = new Date(nowDate.getTime() + expire * 1000);return Jwts.builder().setHeaderParam("typ", "JWT").setSubject(userId + "").setIssuedAt(nowDate).setExpiration(expireDate).signWith(SignatureAlgorithm.HS512, secret).compact();}/*** 生成jwt token*/public String generateToken(long userId, String issuer) {Date nowDate = new Date();//过期时间Date expireDate = new Date(nowDate.getTime() + expire * 1000);return Jwts.builder().setHeaderParam("typ", "JWT").setSubject(userId + "").setIssuedAt(nowDate).setIssuer(issuer).setExpiration(expireDate).signWith(SignatureAlgorithm.HS512, secret).compact();}public Claims getClaimByToken(String token) {try {Claims claims = Jwts.parser().setSigningKey(secret).parseClaimsJws(token).getBody();return claims;}catch (Exception e){log.debug("validate is token error ", e);return null;}}public Claims getClaimByToken(String token, String issuer) {try {Claims claims = Jwts.parser().setSigningKey(secret).parseClaimsJws(token).getBody();if (issuer == null || !claims.getIssuer().equals(issuer)) {return null;}return claims;}catch (Exception e){log.debug("validate is token error ", e);return null;}}/*** token是否过期* @return  true：过期*/public boolean isTokenExpired(Date expiration) {return expiration.before(new Date());}
}
测试

在这里插入图片描述

获取验证码

pomo文件
		<!--图片验证码--><dependency><groupId>com.github.axet</groupId><artifactId>kaptcha</artifactId><version>0.0.9</version></dependency><!--redis--><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-data-redis</artifactId></dependency>
控制器
    @ResourceProducer producer;@ResourceRedisUtil redisUtil;/*** 验证码* @return* @throws IOException*/@GetMapping("/captcha")public Result getCaptcha() throws IOException {// 生成uuid和验证码String uuid = UUID.randomUUID().toString();String code = producer.createText();log.info("uuid : {}, code: {}", uuid, code);// 生成base64编码的图片验证码BufferedImage image = producer.createImage(code);ByteArrayOutputStream outputStream = new ByteArrayOutputStream();ImageIO.write(image, "jpg", outputStream);BASE64Encoder encoder = new BASE64Encoder();String base64Img = "data:image/jpeg;base64," + encoder.encode(outputStream.toByteArray());// 把uuid和验证码存储到redisredisUtil.set(uuid, code, 120);// 返回uuid和base64图片return Result.success(MapUtil.builder().put("uuid", uuid).put("base64Img", base64Img).build());}
验证码工具类
@Configuration
public class KaptchaConfig {@Beanpublic DefaultKaptcha producer(){Properties properties = new Properties();properties.put("kaptcha.border", "no");properties.put("kaptcha.textproducer.font.color", "black");properties.put("kaptcha.textproducer.char.space", "4");properties.put("kaptcha.image.height", "40");properties.put("kaptcha.image.width", "120");properties.put("kaptcha.textproducer.font.size", "30");Config config = new Config(properties);DefaultKaptcha defaultKaptcha = new DefaultKaptcha();defaultKaptcha.setConfig(config);return defaultKaptcha;}
}
Redis工具类
@Component
public class RedisUtil {@Resourceprivate RedisTemplate redisTemplate;/*** 指定缓存失效时间** @param key  键* @param time 时间(秒)* @return*/public boolean expire(String key, long time) {try {if (time > 0) {redisTemplate.expire(key, time, TimeUnit.SECONDS);}return true;} catch (Exception e) {e.printStackTrace();return false;}}/*** 根据key 获取过期时间** @param key 键 不能为null* @return 时间(秒) 返回0代表为永久有效*/public long getExpire(String key) {return redisTemplate.getExpire(key, TimeUnit.SECONDS);}/*** 判断key是否存在** @param key 键* @return true 存在 false不存在*/public boolean hasKey(String key) {try {return redisTemplate.hasKey(key);} catch (Exception e) {e.printStackTrace();return false;}}/*** 删除缓存** @param key 可以传一个值 或多个*/@SuppressWarnings("unchecked")public void del(String... key) {if (key != null && key.length > 0) {if (key.length == 1) {redisTemplate.delete(key[0]);} else {redisTemplate.delete(CollectionUtils.arrayToList(key));}}}//============================String=============================  /*** 普通缓存获取** @param key 键* @return 值*/public Object get(String key) {return key == null ? null : redisTemplate.opsForValue().get(key);}/*** 普通缓存放入** @param key   键* @param value 值* @return true成功 false失败*/public boolean set(String key, Object value) {try {redisTemplate.opsForValue().set(key, value);return true;} catch (Exception e) {e.printStackTrace();return false;}}/*** 普通缓存放入并设置时间** @param key   键* @param value 值* @param time  时间(秒) time要大于0 如果time小于等于0 将设置无限期* @return true成功 false 失败*/public boolean set(String key, Object value, long time) {try {if (time > 0) {redisTemplate.opsForValue().set(key, value, time, TimeUnit.SECONDS);} else {set(key, value);}return true;} catch (Exception e) {e.printStackTrace();return false;}}/*** 递增** @param key 键* @param delta  要增加几(大于0)* @return*/public long incr(String key, long delta) {if (delta < 0) {throw new RuntimeException("递增因子必须大于0");}return redisTemplate.opsForValue().increment(key, delta);}/*** 递减** @param key 键* @param delta  要减少几(小于0)* @return*/public long decr(String key, long delta) {if (delta < 0) {throw new RuntimeException("递减因子必须大于0");}return redisTemplate.opsForValue().increment(key, -delta);}//================================Map=================================  /*** HashGet** @param key  键 不能为null* @param item 项 不能为null* @return 值*/public Object hget(String key, String item) {return redisTemplate.opsForHash().get(key, item);}/*** 获取hashKey对应的所有键值** @param key 键* @return 对应的多个键值*/public Map<Object, Object> hmget(String key) {return redisTemplate.opsForHash().entries(key);}/*** HashSet** @param key 键* @param map 对应多个键值* @return true 成功 false 失败*/public boolean hmset(String key, Map<String, Object> map) {try {redisTemplate.opsForHash().putAll(key, map);return true;} catch (Exception e) {e.printStackTrace();return false;}}/*** HashSet 并设置时间** @param key  键* @param map  对应多个键值* @param time 时间(秒)* @return true成功 false失败*/public boolean hmset(String key, Map<String, Object> map, long time) {try {redisTemplate.opsForHash().putAll(key, map);if (time > 0) {expire(key, time);}return true;} catch (Exception e) {e.printStackTrace();return false;}}/*** 向一张hash表中放入数据,如果不存在将创建** @param key   键* @param item  项* @param value 值* @return true 成功 false失败*/public boolean hset(String key, String item, Object value) {try {redisTemplate.opsForHash().put(key, item, value);return true;} catch (Exception e) {e.printStackTrace();return false;}}/*** 向一张hash表中放入数据,如果不存在将创建** @param key   键* @param item  项* @param value 值* @param time  时间(秒)  注意:如果已存在的hash表有时间,这里将会替换原有的时间* @return true 成功 false失败*/public boolean hset(String key, String item, Object value, long time) {try {redisTemplate.opsForHash().put(key, item, value);if (time > 0) {expire(key, time);}return true;} catch (Exception e) {e.printStackTrace();return false;}}/*** 删除hash表中的值** @param key  键 不能为null* @param item 项 可以使多个 不能为null*/public void hdel(String key, Object... item) {redisTemplate.opsForHash().delete(key, item);}/*** 判断hash表中是否有该项的值** @param key  键 不能为null* @param item 项 不能为null* @return true 存在 false不存在*/public boolean hHasKey(String key, String item) {return redisTemplate.opsForHash().hasKey(key, item);}/*** hash递增 如果不存在,就会创建一个 并把新增后的值返回** @param key  键* @param item 项* @param by   要增加几(大于0)* @return*/public double hincr(String key, String item, double by) {return redisTemplate.opsForHash().increment(key, item, by);}/*** hash递减** @param key  键* @param item 项* @param by   要减少记(小于0)* @return*/public double hdecr(String key, String item, double by) {return redisTemplate.opsForHash().increment(key, item, -by);}//============================set=============================  /*** 根据key获取Set中的所有值** @param key 键* @return*/public Set<Object> sGet(String key) {try {return redisTemplate.opsForSet().members(key);} catch (Exception e) {e.printStackTrace();return null;}}/*** 根据value从一个set中查询,是否存在** @param key   键* @param value 值* @return true 存在 false不存在*/public boolean sHasKey(String key, Object value) {try {return redisTemplate.opsForSet().isMember(key, value);} catch (Exception e) {e.printStackTrace();return false;}}/*** 将数据放入set缓存** @param key    键* @param values 值 可以是多个* @return 成功个数*/public long sSet(String key, Object... values) {try {return redisTemplate.opsForSet().add(key, values);} catch (Exception e) {e.printStackTrace();return 0;}}/*** 将set数据放入缓存** @param key    键* @param time   时间(秒)* @param values 值 可以是多个* @return 成功个数*/public long sSetAndTime(String key, long time, Object... values) {try {Long count = redisTemplate.opsForSet().add(key, values);if (time > 0) expire(key, time);return count;} catch (Exception e) {e.printStackTrace();return 0;}}/*** 获取set缓存的长度** @param key 键* @return*/public long sGetSetSize(String key) {try {return redisTemplate.opsForSet().size(key);} catch (Exception e) {e.printStackTrace();return 0;}}/*** 移除值为value的** @param key    键* @param values 值 可以是多个* @return 移除的个数*/public long setRemove(String key, Object... values) {try {Long count = redisTemplate.opsForSet().remove(key, values);return count;} catch (Exception e) {e.printStackTrace();return 0;}}//===============================list=================================  /*** 获取list缓存的内容** @param key   键* @param start 开始* @param end   结束  0 到 -1代表所有值* @return*/public List<Object> lGet(String key, long start, long end) {try {return redisTemplate.opsForList().range(key, start, end);} catch (Exception e) {e.printStackTrace();return null;}}/*** 获取list缓存的长度** @param key 键* @return*/public long lGetListSize(String key) {try {return redisTemplate.opsForList().size(key);} catch (Exception e) {e.printStackTrace();return 0;}}/*** 通过索引 获取list中的值** @param key   键* @param index 索引  index>=0时， 0 表头，1 第二个元素，依次类推；index<0时，-1，表尾，-2倒数第二个元素，依次类推* @return*/public Object lGetIndex(String key, long index) {try {return redisTemplate.opsForList().index(key, index);} catch (Exception e) {e.printStackTrace();return null;}}/*** 将list放入缓存** @param key   键* @param value 值* @return*/public boolean lSet(String key, Object value) {try {redisTemplate.opsForList().rightPush(key, value);return true;} catch (Exception e) {e.printStackTrace();return false;}}/*** 将list放入缓存** @param key   键* @param value 值* @param time  时间(秒)* @return*/public boolean lSet(String key, Object value, long time) {try {redisTemplate.opsForList().rightPush(key, value);if (time > 0) expire(key, time);return true;} catch (Exception e) {e.printStackTrace();return false;}}/*** 将list放入缓存** @param key   键* @param value 值* @return*/public boolean lSet(String key, List<Object> value) {try {redisTemplate.opsForList().rightPushAll(key, value);return true;} catch (Exception e) {e.printStackTrace();return false;}}/*** 将list放入缓存** @param key   键* @param value 值* @param time  时间(秒)* @return*/public boolean lSet(String key, List<Object> value, long time) {try {redisTemplate.opsForList().rightPushAll(key, value);if (time > 0) expire(key, time);return true;} catch (Exception e) {e.printStackTrace();return false;}}/*** 根据索引修改list中的某条数据** @param key   键* @param index 索引* @param value 值* @return*/public boolean lUpdateIndex(String key, long index, Object value) {try {redisTemplate.opsForList().set(key, index, value);return true;} catch (Exception e) {e.printStackTrace();return false;}}/*** 移除N个值为value** @param key   键* @param count 移除多少个* @param value 值* @return 移除的个数*/public long lRemove(String key, long count, Object value) {try {Long remove = redisTemplate.opsForList().remove(key, count, value);return remove;} catch (Exception e) {e.printStackTrace();return 0;}}//================有序集合 sort set===================/*** 有序set添加元素** @param key* @param value* @param score* @return*/public boolean zSet(String key, Object value, double score) {return redisTemplate.opsForZSet().add(key, value, score);}public long batchZSet(String key, Set<ZSetOperations.TypedTuple> typles) {return redisTemplate.opsForZSet().add(key, typles);}public void zIncrementScore(String key, Object value, long delta) {redisTemplate.opsForZSet().incrementScore(key, value, delta);}public void zUnionAndStore(String key, Collection otherKeys, String destKey) {redisTemplate.opsForZSet().unionAndStore(key, otherKeys, destKey);}/*** 获取zset数量* @param key* @param value* @return*/public long getZsetScore(String key, Object value) {Double score = redisTemplate.opsForZSet().score(key, value);if(score==null){return 0;}else{return score.longValue();}}/*** 获取有序集 key 中成员 member 的排名 。* 其中有序集成员按 score 值递减 (从大到小) 排序。* @param key* @param start* @param end* @return*/public Set<ZSetOperations.TypedTuple> getZSetRank(String key, long start, long end) {return redisTemplate.opsForZSet().reverseRangeWithScores(key, start, end);}}
测试

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

注册

控制器
    /*** 注册* @param form* @return*/@PostMapping("/register")public Result register(@Validated @RequestBody RegisterDto form){// 验证验证码是否正确Assert.isTrue(form.getCode().equals(redisUtil.get(form.getUuid())), "验证码不正确");// 判断用户名是否已存在long count = appUserService.count(new QueryWrapper<AppUser>().eq("username", form.getUsername()));if(count > 0){return Result.fail("用户名已存在");}// 进行注册AppUser user = new AppUser();user.setUsername(form.getUsername());user.setPassword(SecureUtil.md5(form.getPassword()));user.setCreated(LocalDateTime.now());appUserService.save(user);return Result.success();}
测试

在这里插入图片描述
在这里插入图片描述

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

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

相关文章

智慧燃气让城市能源系统高效运行

智慧燃气让城市能源系统高效运行

关键词&#xff1a;智慧燃气、燃气数字化、智慧燃气平台、智慧燃气解决方案、智慧燃气系统 随着我国城镇燃气行业的发展&#xff0c;燃气行业管理及服务从简单的手工运作阶段迈入数字燃气阶段&#xff0c;大量采用信息化手段管理燃气业务&#xff0c;智慧燃气应运而生。它既是…
阅读更多...
【深度学习】注意力机制（六）

【深度学习】注意力机制（六）

本文介绍一些注意力机制的实现&#xff0c;包括MobileVITv1/MobileVITv2/DAT/CrossFormer/MOA。 【深度学习】注意力机制&#xff08;一&#xff09; 【深度学习】注意力机制&#xff08;二&#xff09; 【深度学习】注意力机制&#xff08;三&#xff09; 【深度学习】注意…
阅读更多...
国产数据库适配-达梦（DM）

国产数据库适配-达梦（DM）

1、通用性 达梦数据库管理系统兼容多种硬件体系&#xff0c;可运行于X86、X64、SPARC、POWER等硬件体系之上。DM各种平台上的数据存储结构和消息通信结构完全一致&#xff0c;使得DM各种组件在不同的硬件平台上具有一致的使用特性。 达梦数据库管理系统产品实现了平台无关性&…
阅读更多...
Docker技术基础梳理 - Docker网络管理

Docker技术基础梳理 - Docker网络管理

为什么需要容器的网络管理&#xff1f; 容器的网络默认与宿主机、与其他容器相互隔离&#xff0c;且容器中可以运行一些网络应用&#xff0c;比如nginx、web应用、数据库等&#xff0c;如果需要让外部也可以访问这些容器中运行的网络应用&#xff0c;那么就需要配置网络来实现…
阅读更多...
thinkphp连接数据库mysql 报错问题

thinkphp连接数据库mysql 报错问题

第一 看报错日志php如果是下面这个报错的话 就是mysql 数据库没有验证连接 ​​​​​​​[2023-12-13T09:57:0108:00][error] [10501]SQLSTATE[HY000] [2054] The server requested authentication method unknown to the client 我们就可以去mysql 的文件检查 验证身份 使…
阅读更多...
量子芯片技术：未来的计算革命

量子芯片技术：未来的计算革命

量子芯片技术&#xff1a;未来的计算革命 一、引言 随着科技的不断发展&#xff0c;人类正在进入一个全新的技术时代&#xff0c;即量子时代。量子芯片技术作为这个时代的重要代表&#xff0c;正逐渐改变我们对计算和信息处理的理解。本文将深入探讨量子芯片技术的基本原理、…
阅读更多...
【概率方法】重要性采样

【概率方法】重要性采样

从一个极简分布出发 假设我们有一个关于随机变量 X X X 的函数 f ( X ) f(X) f(X)&#xff0c;满足如下分布 p ( X ) p(X) p(X)0.90.1 f ( X ) f(X) f(X)0.10.9 如果我们要对 f ( X ) f(X) f(X) 的期望 E p [ f ( X ) ] \mathbb{E}_p[f(X)] Ep​[f(X)] 进行估计&#xff0…
阅读更多...
数据无效：问题和解决方案的分析

数据无效：问题和解决方案的分析

一、说明 在数字时代&#xff0c;数据已成为企业、组织和个人的基本资源。然而&#xff0c;在浩瀚的数据海洋中&#xff0c;困扰数据分析的一个常见问题是存在空值或缺失数据。数据无效是指某些数据字段中缺少信息&#xff0c;这在根据该数据进行分析和决策时可能会导致重大问题…
阅读更多...
【计算机视觉】SIFT

【计算机视觉】SIFT

在边缘提取的时候&#xff0c;用高斯一阶导对信号进行卷积&#xff0c;响应值最大的就是边界如果用高斯二阶导对信号进行卷积&#xff0c;0点就是边界点&#xff08;二阶导等于0的点&#xff0c;对应一阶导的极值点&#xff09; 如果用高斯二阶导在不同的信号上进行卷积&#x…
阅读更多...
JS基础之作用域链

JS基础之作用域链

JS基础之作用域链 作用域链作用域链函数创建函数激活总结 作用域链 当JavaScript代码执行一段可执行的代码&#xff08;execution code&#xff09;时&#xff0c;会创建对应的执行上下文&#xff08;execution context&#xff09;。 对于每个执行上下文&#xff0c;都有三个重…
阅读更多...
Linux 安装图形界面 “startx”

Linux 安装图形界面 “startx”

———————————————— 报错&#xff0c;如下&#xff1a; bash :startx command not found ———————————————— 解决方法&#xff1a; 1.先安装 — X Windows System&#xff0c;输入以下命令&#xff1a; yum groupinstall “X Window System”…
阅读更多...
【干货分享】KingIOServer与三菱PLC的通讯的应用案例

【干货分享】KingIOServer与三菱PLC的通讯的应用案例

哈喽&#xff0c;大家好&#xff0c;我是雷工&#xff01; 最近一个项目涉及用KingIOServer采集三菱PLC数据&#xff0c;特记录通讯过程方便备忘。 一、版本说明&#xff1a; 1、KingIOServer版本&#xff1a;3.7SP2 2、PLC型号&#xff1a;Q03UDV 和Q03UDE自带以太网网口。…
阅读更多...
redis：一、面试题常见分类+缓存穿透的定义、解决方案、布隆过滤器的原理和误判现象、面试回答模板

redis：一、面试题常见分类+缓存穿透的定义、解决方案、布隆过滤器的原理和误判现象、面试回答模板

redis面试题常见分类 缓存穿透 定义 缓存穿透是一种现象&#xff0c;引发这种现象的原因大概率是遭到了恶意攻击。具体就是查询一个一定不存在的数据&#xff0c;mysql查询不到数据也不会直接写入缓存&#xff0c;就会导致这个数据的每次请求都需要查DB&#xff0c;数据库压力…
阅读更多...
人工智能导论习题集（3）

人工智能导论习题集（3）

第五章&#xff1a;不确定性推理 题1题2题3题4题5题6题7题8 题1 题2 题3 题4 题5 题6 题7 题8
阅读更多...
基于YOLOv8深度学习的吸烟/抽烟行为检测系统【python源码+Pyqt5界面+数据集+训练代码】目标检测、深度学习实战

基于YOLOv8深度学习的吸烟/抽烟行为检测系统【python源码+Pyqt5界面+数据集+训练代码】目标检测、深度学习实战

《博主简介》 小伙伴们好&#xff0c;我是阿旭。专注于人工智能、AIGC、python、计算机视觉相关分享研究。 ✌更多学习资源&#xff0c;可关注公-仲-hao:【阿旭算法与机器学习】&#xff0c;共同学习交流~ &#x1f44d;感谢小伙伴们点赞、关注&#xff01; 《------往期经典推…
阅读更多...
编程应用实际场景：台球厅怎么样用电脑给客人计时，台球计时收费系统操作教程

编程应用实际场景：台球厅怎么样用电脑给客人计时，台球计时收费系统操作教程

一、前言 准确控制顾客在店内游玩的时间&#xff0c;从而控制店内的各项成本&#xff0c;并提升店内的客流量。在顾客享受计时项目的时候&#xff0c;可以同时添加其他食物消费&#xff0c;并将单据合并统一结账。软件中的会员功能可以为客户办理会员可以使用灯控器控灯&#…
阅读更多...
C语言之基本数据类型和数

C语言之基本数据类型和数

目录 算数类型和基本数据类型 基数 基数转换 由八进制数、十六进制数、二进制数向十进制数转换 由十进制数向八进制数、十六进制数、二进制数转换 二进制和十六进制的基数转换 在学习基本数据类型之前我们先来学习数。 算数类型和基本数据类型 在前面的学习中我们可以使用…
阅读更多...
html 中vue3 的setup里调用element plus的弹窗 提示

html 中vue3 的setup里调用element plus的弹窗 提示

引入Elementplus之后&#xff0c;在setup&#xff08;&#xff09;方法外面导入ElMessageBox const {ElMessageBox} ElementPlus 源码 &#xff1a; <!DOCTYPE html> <html> <head><meta charset"UTF-8"><!-- import Vue before Elemen…
阅读更多...
外包干了3个月，技术退步明显.......

外包干了3个月，技术退步明显.......

先说一下自己的情况&#xff0c;大专生&#xff0c;18年通过校招进入武汉某软件公司&#xff0c;干了接近4年的功能测试&#xff0c;今年年初&#xff0c;感觉自己不能够在这样下去了&#xff0c;长时间呆在一个舒适的环境会让一个人堕落! 而我已经在一个企业干了四年的功能测…
阅读更多...
Web前端 ---- 【Vue】Vue路由传参（query和params）

Web前端 ---- 【Vue】Vue路由传参（query和params）

目录 前言 为什么用路由 路由route和路由器router Vue中路由的工作原理 安装配置vue-router 使用VueRouter 多级路由 路由传参 query传参 params传参 前言 本文介绍路由相关知识路由传参 为什么用路由 为了单页面应用开发&#xff0c;只更换组件&#xff0c;不频繁刷…
阅读更多...
最新文章
推荐文章

Copyright @ 2022~2023