品牌新增業務之後臺代碼的編寫

今天是劉小愛自學Java的第147天。

感謝你的觀看，謝謝你。

學習計劃安排如下：

• 寫完查詢業務，繼續寫品牌新增業務。
• 查詢業務我們從前端到後臺完整地寫了一遍。
• 新增業務就不用自己使用vue寫前端頁面了，直接用模板，主要專注於後臺Java代碼的編寫。

一、新增品牌頁面

雖說有現成已經寫好的前端模板，但是也要自己看得明白，不然幹了啥都不清楚。

點擊新增品牌按鈕，會彈出一個對話框，其vue是如何編寫的呢，我們看下代碼：

因為vue文件代碼太長，我不可能全部截下來，截其中關鍵的部分，做一個流程梳理：

①新增品牌按鈕

給該按鈕設定了一個點擊事件，點擊事件一旦觸發會調用addBrand方法。

②addBrand方法

看名字就知道是新增品牌業務，其具體幹了啥呢？它將show設置成了true。

這個show又是啥呢？

③彈出的對話框

show默認值是false，是用來隱藏/顯示對話框的，③其實也就對應著彈出的對話框。

我們再次深入會發現，closeWindow方法對應的也就是對話框右上角的關閉按鈕，它就是將show設置成false了，所以能關閉對話框。

值得注意的是：

前端代碼也可以和後臺Java代碼一樣，使用Ctrl+左鍵快速跳轉到方法/屬性/組件。

④自定義組件brand-form

Ctrl+左鍵點擊該標籤會跳轉到新文件，這也就是我們自定義的組件brand-form。

2BrandForm.vue文件

這是一個自定義的vue組件，其有一個name屬性，值為brand-form。

在其它頁面中可以使用import引入該組件再使用，頁面受限就不截圖說明了。

總之標籤名和name屬性要保持一致。

①前端校驗

看到required就可以想到是前端數據校驗，要求該數據不能為空。

②圖片上傳業務

這個對應了另一個獨立的業務，其請求路徑即為url，要在伺服器中接受該請求處理，該業務我們後續會說明。

③submit方法

提交按鈕對應的submit方法：

確定四件事情：

• 請求路徑：如上圖所示。
• 請求方式：例子中是Post請求。
• 請求參數：此處是上圖4個參數。
• 返回值：返回值為空。

確定這4點就可以編寫後臺代碼了。

二、後臺代碼編寫

Java三層代碼編寫，品牌新增依舊是屬於商品微服務lxa-item中的品牌相關。

1Controller層

@RequestMapping設定請求路徑。

@PostMapping接受Post請求。

請求參數本來一共有4個：

• 其中有3個是屬於Brand實體類的屬性，所以用Brand對象代替。
• cids是商品分類id。

返回值為空，所以rest風格中用ResponseEntity<Void>來表示。

響應的狀態碼是201「Created」即對應的枚舉CREATED。

2Service層

①新增品牌

因為我們昨天就編寫過Brand實體類，並利用通用mapper將其和數據表對應起來了。

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

②新增cid和bid

新增數據到中間表tb_category_brand。

因為我們沒有創建和其相關的Java實體類，所以沒法直接使用通用mapper。

但是好在Mybatis支持註解，所以我們創建insertCategoryBrand方法使用註解說明新增sql語句。

一個品牌id對應多個分類id，比如說小米這個品牌，既可以是手機，也可以是電飯煲等。

所以將分類id也就是上述的cids遍歷，新增bid和其對應的cid到數據表中。

3Mapper層

使用註解@Insert編寫新增sql語句，同理還有查詢、修改和刪除語句都可以。

當然也可以使用xml配置sql語句，只不過語句比較簡單，所以直接使用註解即可。

三、新增品牌測試

代碼編寫完畢，做一個測試

我們在新增品牌頁面中填寫數據，點擊提交按鈕，向伺服器發送請求。

伺服器接收請求後會分別向資料庫中的兩張表新增對應的數據。

最後

行有不得反求諸己，我是@劉小愛。

白天上班晚上學習，和Java同歲，不為其它，只為學會自律做好自己，也願我的每日打卡能給你帶來勇氣，歡迎點讚關注和評論。