微服务项目第17天：品牌新增业务的实现

古城微笑少年丶 2022-12-04 08:34 183阅读 0赞

### 目录 ###

*   *   *  
     *  一、新增品牌页面
     *  二、后台代码编写
     *  三、新增品牌测试
     *  最后

###  ###

今天是刘小爱自学Java的第147天。

感谢你的观看，谢谢你。  
![format_png][]

学习计划安排如下：

*  写完查询业务，继续写品牌新增业务。
 *  查询业务我们从前端到后台完整地写了一遍。
 *  新增业务就不用自己使用vue写前端页面了，直接用模板，主要专注于后台Java代码的编写。

## 一、新增品牌页面 ##

虽说有现成已经写好的前端模板，但是也要自己看得明白，不然干了啥都不清楚。

点击新增品牌按钮，会弹出一个对话框，其vue是如何编写的呢，我们看下代码：

![format_png 1][]

因为vue文件代码太长，我不可能全部截下来，截其中关键的部分，做一个流程梳理：

**①新增品牌按钮**

给该按钮设定了一个点击事件，点击事件一旦触发会调用addBrand方法。

**②addBrand方法**

看名字就知道是新增品牌业务，其具体干了啥呢？它将show设置成了true。

这个show又是啥呢？

**③弹出的对话框**

show默认值是false，是用来隐藏/显示对话框的，③其实也就对应着弹出的对话框。

我们再次深入会发现，closeWindow方法对应的也就是对话框右上角的关闭按钮，它就是将show设置成false了，所以能关闭对话框。

**值得注意的是**：

前端代码也可以和后台Java代码一样，使用Ctrl+左键快速跳转到方法/属性/组件。

**④自定义组件brand-form**

Ctrl+左键点击该标签会跳转到新文件，这也就是我们自定义的组件brand-form。

**2BrandForm.vue文件**

![format_png 2][]

这是一个自定义的vue组件，其有一个name属性，值为brand-form。

在其它页面中可以使用import引入该组件再使用，页面受限就不截图说明了。

总之标签名和name属性要保持一致。

**①前端校验**

看到required就可以想到是前端数据校验，要求该数据不能为空。

**②图片上传业务**

这个对应了另一个独立的业务，其请求路径即为url，要在服务器中接受该请求处理，该业务我们后续会说明。

**③submit方法**

提交按钮对应的submit方法：

![format_png 3][]

确定四件事情：

*  请求路径：如上图所示。
 *  请求方式：例子中是Post请求。
 *  请求参数：此处是上图4个参数。
 *  返回值：返回值为空。

确定这4点就可以编写后台代码了。

## 二、后台代码编写 ##

Java三层代码编写，品牌新增依旧是属于商品微服务lxa-item中的品牌相关。

**1Controller层**

![format_png 4][]

@RequestMapping设定请求路径。

@PostMapping接受Post请求。

请求参数本来一共有4个：

*  其中有3个是属于Brand实体类的属性，所以用Brand对象代替。
 *  cids是商品分类id。

返回值为空，所以rest风格中用ResponseEntity<Void>来表示。

响应的状态码是201“Created”即对应的枚举CREATED。

**2Service层**

![format_png 5][]

**①新增品牌**

因为我们昨天就编写过Brand实体类，并利用通用mapper将其和数据表对应起来了。

所以新增时直接使用通用mapper的insertSelective()方法即可新增品牌。

**②新增cid和bid**

新增数据到中间表tb\_category\_brand。

因为我们没有创建和其相关的Java实体类，所以没法直接使用通用mapper。

但是好在Mybatis支持注解，所以我们创建insertCategoryBrand方法使用注解说明新增sql语句。

一个品牌id对应多个分类id，比如说小米这个品牌，既可以是手机，也可以是电饭煲等。

所以将分类id也就是上述的cids遍历，新增bid和其对应的cid到数据表中。

**3Mapper层**

![format_png 6][]

使用注解@Insert编写新增sql语句，同理还有查询、修改和删除语句都可以。

当然也可以使用xml配置sql语句，只不过语句比较简单，所以直接使用注解即可。

## 三、新增品牌测试 ##

代码编写完毕，做一个测试

![format_png 7][]

我们在新增品牌页面中填写数据，点击提交按钮，向服务器发送请求。

服务器接收请求后会分别向数据库中的两张表新增对应的数据。

## 最后 ##

行有不得反求诸己，我是@刘小爱

一个白天上班晚上学习的95后沪漂，不为其它，只为学会自律做好自己，也愿我的每日打卡能给你带来勇气，欢迎点赞关注和评论。

[format_png]: /images/20221123/fe330cdbdee14fe1ac1f5661b461ad01.png
[format_png 1]: /images/20221123/db607129e8e64318be30e6e282f4fb18.png
[format_png 2]: /images/20221123/f9f5af7ca9274a69b53b2f694d96e078.png
[format_png 3]: /images/20221123/ecb128a6dc424f5fa468da3988cd66b9.png
[format_png 4]: /images/20221123/ebc7f406238b49c6b266f2609bf5c3e5.png
[format_png 5]: /images/20221123/5a0584986b704e22ab563f99cdd573ae.png
[format_png 6]: /images/20221123/afae03190da74ba8bfd1e78020dfefa9.png
[format_png 7]: /images/20221123/eeba139a6caa4570986b768dcc446c96.png

发表评论取消回复

表情：

评论列表（有 0 条评论，183人围观）

还没有评论，来说两句吧...

相关阅读

相关【日记】164微服务项目第34天

01 一句话日记 2020/9/23 ![61bbb64af2456c48be26530bc2dfeeec.png][] 02 Day164 每日总结老实说，感

叁歲伎倆/ 2022年12月11日 09:27/ 0 赞/ 168 阅读

相关【日记】161微服务项目第31天

01 一句话日记 2020/9/20 ![92dd17e03e5c3e115b85625f56e60633.png][] 02 Day161 每日总结学了几天的

灰太狼/ 2022年12月11日 09:27/ 0 赞/ 180 阅读

相关【日记】163微服务项目第33天

01 一句话日记 2020/9/22 ![62bc52d9242a545481491ef24881a6c4.png][] 02 Day163 每日总结好，正式回

雨点打透心脏的1/2处/ 2022年12月11日 09:26/ 0 赞/ 184 阅读

相关【日记】167微服务项目第37天

01 一句话日记 2020/9/27 ![bacd5c7172439f5708e4b9010e7594aa.png][] 02 Day167 每日总结自定义工具

女爷i/ 2022年12月11日 09:26/ 0 赞/ 148 阅读

相关【日记】160微服务项目第30天

01 一句话日记 2020/9/19 ![d9f7c2f2d1bcca9bda15add80cf85d8f.png][] 02 Day160 每日总结 Elast

待我称王封你为后i/ 2022年12月11日 09:26/ 0 赞/ 181 阅读

相关微服务项目第25天：商品新增业务（完）

目录一、请求相关以及实体类二、Java代码编写三、说明最后今天是刘小爱自学

╰半夏微凉°/ 2022年12月07日 12:16/ 0 赞/ 176 阅读

相关微服务项目第24天：商品新增业务（二）

今天是刘小爱自学Java的第154天。感谢你的观看，谢谢你。 ![9e37365ba3cd47999a25de048a898407.png][] 学习计划安排如下：

不念不忘少年蓝@/ 2022年12月06日 15:49/ 0 赞/ 210 阅读

相关微服务项目第17天：品牌新增业务的实现

目录一、新增品牌页面二、后台代码编写三、新增品牌测试最后今天是刘小爱自学J

古城微笑少年丶/ 2022年12月04日 08:34/ 0 赞/ 184 阅读

相关微服务项目第13天：商品分类业务的实现

目录一、商品分类业务二、后台代码编写三、网关测试最后今天是刘小爱自学Jav

深藏阁楼爱情的钟/ 2022年12月03日 08:43/ 0 赞/ 160 阅读

相关微服务项目之电商--15.后台分页查询及新增品牌业务添加

目录一、后台提供查询接口 1.数据库表 2.实体类 3、mapper 4.controller 分页业务与通用mapper的使用前端数据接收二、新

深藏阁楼爱情的钟/ 2021年11月13日 19:42/ 0 赞/ 395 阅读