公司网站大全,ps软件下载电脑版教程,婚礼网站有哪些,企业网站如何上存今天是刘小爱自学Java的第146天。感谢你的观看#xff0c;谢谢你。商品品牌业务之后台Java代码的编写-1.jpg (50.46 KB, 下载次数: 1)2021-2-5 00:22 上传学习计划安排如下#xff1a;昨天实现了前端页面的编写以及发送请求#xff0c;今天关于异步请求工具axios的简单说明。…今天是刘小爱自学Java的第146天。感谢你的观看谢谢你。商品品牌业务之后台Java代码的编写-1.jpg (50.46 KB, 下载次数: 1)2021-2-5 00:22 上传学习计划安排如下昨天实现了前端页面的编写以及发送请求今天关于异步请求工具axios的简单说明。关于商品品牌后台代码的完整编写。两个重要知识点分页助手插件的使用通用mapper高阶查询的使用。一、异步请求工具axios我们以前使用的是jQuery发送ajax请求但是在Vue中还要引入jQuery不太方便。Vue官方推荐的ajax请求框架叫做axios商品品牌业务之后台Java代码的编写-2.jpg (32.77 KB, 下载次数: 0)2021-2-5 00:22 上传axios支持Http的所有7种请求方式并且有对应的方法如Get、POST与其对应。另外这些方法最终返回的是一个Promise对异步调用进行封装。因此可以用.then() 来接收成功时回调.catch()完成失败时回调也就是我们昨天的代码编写。但是昨天写的代码很难看出来是使用的axios因为其有配置让其使用更简单了。axios的配置商品品牌业务之后台Java代码的编写-3.jpg (71.57 KB, 下载次数: 0)2021-2-5 00:22 上传①使用axios发送请求prototyte原型的意思有什么作用呢就相当于给Vue这个类增加了一个$http方法对应的就是axios昨天发送请求时使用的this.$http其实就相当于这里的axios。本来呢如果要使用axios需要先引入axios再使用axios调用get方法即可发送get请求。做了该配置后就不用引入axios库了直接调用vue的$http方法即可。②基础请求路径直接引用config.js文件中的url即可也就是网关对应的域名路由最先开始就说明过。二、后台代码编写个人的编写代码思路首先确定对应实体类其次确定请求参数、请求路径和返回值最后Java三层代码编写。1实体类和数据表商品品牌业务之后台Java代码的编写-4.jpg (55.44 KB, 下载次数: 0)2021-2-5 00:22 上传数据库中对应的数据表为tb_brand编写实体类Brand和其一一对应。2返回值数据编写一个分页数据实体类在其它业务中若是需要分页数据也可以使用这个类。所以将其存放到lxa-common微服务中其它微服务要用这个直接引用即可。商品品牌业务之后台Java代码的编写-5.jpg (43.93 KB, 下载次数: 0)2021-2-5 00:22 上传分页数据包括了分页总条数总页数以及当前页数据数。这个items也就是我们通过数据库查询到的Brand集合。3Controller层该层接受请求和响应处理后的数据其最重要的也就是请求路径和请求参数。通过浏览器F12可以查看到发送的请求路径以及请求参数。商品品牌业务之后台Java代码的编写-6.jpg (67.5 KB, 下载次数: 0)2021-2-5 00:22 上传①关于请求路径注解RequestMapping和GetMapping确定其请求路径当然全路径中还包括网关对应的域名以及配置的路由。②关于请求参数一共有5个参数逐一说明page当前页码数默认设定为第1页。rows每页展示多少行数据默认设定为5行。sortBy根据什么参数排序上图中就是根据id排序该参数可以没有。key这个是前端页面搜索框中输入的数据根据key模糊查询。desc排序规则如果是true降序排序如果是false升序排序。defaultValue设定默认值requiredfalse表示该参数可以没有如果不写的话默认为true必须要有该参数才行。4Service层和Mapper层因为是单表查询所以使用通用mapper插件即可mapper层代码超简单就不说明了。商品品牌业务之后台Java代码的编写-7.jpg (74.23 KB, 下载次数: 0)2021-2-5 00:22 上传①分页助手的使用PageHelper是Mybatis的一个分页插件其使用起来非常的方便。调用startPage()方法开启分页助手的使用参数为当前页码数和每页的行数。在⑤中创建一个PageInfo对象其和分页相关的数据都可以用对应的get方法获取。②根据key值模糊查询我们在搜索框中输入的数据为keykey值要么是品牌名name包含的值。key值要么就是品牌首字母letter。③排序关于通用mapper的使用第132天有说明。用一个三元表达式来说明是升序还是降序一定要注意要留有空格具体看图中说明。④查询结果如果查询结果为空自定义一个异常报错关于自定义异常后续专门写一篇文章额外说明emm……具体看情况吧。三、前端页面接受请求通过浏览器F12查看响应到的数据。1响应数据渲染商品品牌业务之后台Java代码的编写-8.jpg (64.27 KB, 下载次数: 0)2021-2-5 00:22 上传因为我们在前端代码中打印了响应的数据也就是consol.log(resp)这段代码。在浏览器中可以查看到具体的响应数据。我们可以发现数据主要存储在data中items即为响应的每行数据因为设置的rows值为5所以这里items大小也就是为5。total即总记录数数据库中一共查到了164条品牌数据。totalPage即总页数因为我们这里没有编写对应的业务所以为null。将响应的数据赋值给前端vue中对应的值即可其中关于loading再次做一个说明loading为true前端页面中有一条不断加载的线来表示数据正在加载中。loading为为false不再显示那条线。2做一个测试在管理页面中选择我的品牌管理向服务器发送请求获取响应数据并完成数据渲染商品品牌业务之后台Java代码的编写-9.jpg (40.72 KB, 下载次数: 0)2021-2-5 00:22 上传页面加载后的结果就是如上图所示这是我调到了第2页后的数据。由于vue组件的使用所以自行实现了分页功能不用我们自己以前那样一一对应渲染了。其中关于图片的业务还未处理数据库中有的也没有图片数据所以没有显示。最后行有不得反求诸己我是刘小爱。白天上班晚上学习和Java同岁不为其它只为学会自律做好自己也愿我的每日打卡能给你带来勇气欢迎点赞关注和评论。
