書接上回，上一回我們完成了用戶管理頁(yè)面的構(gòu)建，并且通過(guò)前端的Vue.js框架動(dòng)態(tài)地獲取表單數(shù)據(jù)，同時(shí)異步請(qǐng)求后端Iris接口進(jìn)行入庫(kù)操作，過(guò)程中使用函數(shù)封裝可復(fù)用的邏輯。 本回我們將繼續(xù)完善用戶管理功能。
成都創(chuàng)新互聯(lián)主營(yíng)皮山網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營(yíng)網(wǎng)站建設(shè)方案,App定制開(kāi)發(fā),皮山h5重慶小程序開(kāi)發(fā)公司搭建,皮山網(wǎng)站營(yíng)銷推廣歡迎皮山等地區(qū)企業(yè)咨詢
雖然在之前的章節(jié)中已經(jīng)完成了用戶添加（注冊(cè)）的功能，然而我們忽略了一個(gè)重要的細(xì)節(jié)，那就是用戶名（username）應(yīng)該是全局唯一的字段，而添加邏輯中并未做唯一性校驗(yàn)，事實(shí)上唯一性校驗(yàn)有兩種方案，一種是入庫(kù)之前做一次查詢，但這樣會(huì)浪費(fèi)一次磁盤的IO操作，另外一種就是通過(guò)唯一索引進(jìn)行攔截操作，這里我們采用后者，修改model.go文件：
重慶分公司
重慶分公司
package model
import (
"time"
"github.com/jinzhu/gorm"
)
type Model struct {
ID uint `gorm:"primary_key"`
CreatedAt time.Time
UpdatedAt time.Time
DeletedAt *time.Time
}
type User struct {
gorm.Model
Username string `gorm:"unique;not null"`
Password string
}
這里為User結(jié)構(gòu)體的字段Username添加unique索引，隨后將user表刪除，重新進(jìn)行數(shù)據(jù)庫(kù)遷移操作：
db.AutoMigrate(&model.User{})
接著查看表結(jié)構(gòu)：
MySQL [irisblog]> SHOW CREATE TABLE user;
+-------+------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------+
| Table | Create Table |
+-------+------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------+
| user | CREATE TABLE `user` (
`id` int(10) unsigned NOT NULL AUTO_INCREMENT,
`created_at` datetime DEFAULT NULL,
`updated_at` datetime DEFAULT NULL,
`deleted_at` datetime DEFAULT NULL,
`username` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL,
`password` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL,
PRIMARY KEY (`id`),
UNIQUE KEY `username` (`username`),
KEY `idx_user_deleted_at` (`deleted_at`)
) ENGINE=InnoDB AUTO_INCREMENT=22 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci |
+-------+------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------+
1 row in set (0.00 sec)
發(fā)現(xiàn)username字段已經(jīng)被Gorm添加了唯一索引：UNIQUE KEY `username` (`username`)
隨后修改用戶添加邏輯：
app.Post("/admin/user_action/", func(ctx iris.Context) {
username := ctx.PostValue("username")
password := ctx.PostValue("password")
fmt.Println(username, password)
md5str := mytool.Make_password(password)
user := &model.User{Username: username, Password: md5str}
res := db.Create(user)
if res.Error != nil {
fmt.Println(res.Error)
ret := map[string]string{
"errcode": "1",
"msg": "用戶名不能重復(fù)",
}
ctx.JSON(ret)
return
}
ret := map[string]string{
"errcode": "0",
"msg": "ok",
}
ctx.JSON(ret)
})
這里res結(jié)構(gòu)體中的Error字段來(lái)返回錯(cuò)誤，如果Error不等于nil，說(shuō)明被唯一索引攔截了下來(lái)。
隨后構(gòu)建 ret 字典，聲明錯(cuò)誤碼和提示信息，然后使用ctx.JSON函數(shù)序列化為Json格式返回給前端，注意別忘了用return關(guān)鍵字結(jié)束邏輯，否則代碼會(huì)繼續(xù)執(zhí)行，返回值樣例：
{
errcode: "1",
msg: "用戶名不能重復(fù)"
}
前端接收到返回值之后，可以通過(guò)alert方法打印返回值：
submit:function(){
this.myaxios("http://localhost:5000/admin/user_action/","post",{"username":this.username,"password":this.password}).then(data => {
console.log(data)
alert(data.msg);
});
}
如圖所示：
用戶更新指的是密碼的修改，首先需要構(gòu)造新密碼的表單變量：
data() {
return {
//用戶名
username: "",
//密碼
password:"",
//用戶列表
userlist:[],
//新密碼
newpass:[]
};
},
注意，這里是動(dòng)態(tài)表單，因?yàn)槊恳粋€(gè)表單會(huì)對(duì)應(yīng)一個(gè)用戶：
for(let i=0,l=this.userlist.length;i這里每返回一個(gè)用戶，就會(huì)為該用戶對(duì)應(yīng)生成一個(gè)value字段。
隨后在循環(huán)中綁定該字段：
用戶id
用戶名
新密碼
添加時(shí)間
操作
{{ item.ID }}
{{ item.Username }}
{{ item.CreatedAt }}
如圖所示：
隨后綁定單擊事件，向后端iris傳遞參數(shù)：
update:function(i){
console.log(this.userlist[i].ID);
console.log(this.newpass[i].value);
if(this.newpass[i].value == ""){
alert("新密碼不能為空");
return false;
}
this.myaxios("http://localhost:5000/admin/user_action/","put",{"id":this.userlist[i].ID,"password":this.newpass[i].value}).then(data => {
console.log(data)
alert(data.msg);
});
}
這里傳遞的參數(shù)是用戶id以及用戶的新密碼，注意請(qǐng)求方式使用Put。
隨后在后端Iris中添加更新邏輯：
app.Put("/admin/user_action/", func(ctx iris.Context) {
ID := ctx.PostValue("id")
Password := ctx.PostValue("password")
user := &model.User{}
db.First(&user, ID)
user.Password = mytool.Make_password(Password)
db.Save(&user)
ret := map[string]string{
"errcode": "0",
"msg": "更新密碼成功",
}
ctx.JSON(ret)
})
這里使用Put函數(shù)監(jiān)聽(tīng)路由，隨后接受參數(shù)ID和Password，注意Put和Post方式都采用ctx.PostValue函數(shù)來(lái)獲取參數(shù)。
接著使用db.First(&user, ID)函數(shù)來(lái)進(jìn)行主鍵查詢，查出用戶的結(jié)構(gòu)體變量對(duì)象，最后調(diào)用db.Save函數(shù)來(lái)存儲(chǔ)更新結(jié)果：
MySQL [irisblog]> select * from user where id = 16\G
*************************** 1. row ***************************
id: 16
created_at: 2022-08-22 19:41:40
updated_at: 2022-08-23 15:41:09
deleted_at: NULL
username: admin
password: 202cb962acb964b07152d234b70
1 row in set (0.00 sec)
MySQL [irisblog]>
可以看到，password和updated_at兩個(gè)字段已經(jīng)同步更新了。
接著是刪除操作，首先前端添加刪除按鈕：
{{ item.ID }}
{{ item.Username }}
{{ item.CreatedAt }}
隨后綁定刪除事件：
del:function(i){
var r=confirm("您確定要?jiǎng)h除嗎?");
if (r==true){
this.myaxios("http://localhost:5000/admin/user_action/","delete",{"id":this.userlist[i].ID}).then(data => {
console.log(data)
alert(data.msg);
});
}
},
注意這里的請(qǐng)求方式是delete。
如圖所示：
隨后編寫后端刪除邏輯：
app.Delete("/admin/user_action/", func(ctx iris.Context) {
ID := ctx.URLParamIntDefault("id", 0)
db.Delete(&model.User{}, ID)
ret := map[string]string{
"errcode": "0",
"msg": "刪除用戶成功",
}
ctx.JSON(ret)
})
這里使用Delete函數(shù)來(lái)監(jiān)聽(tīng)路由，同時(shí)通過(guò)ctx.URLParamIntDefault函數(shù)獲取前端請(qǐng)求的參數(shù)，注意Get和Delete方式獲取參數(shù)的請(qǐng)求函數(shù)是一致的，同理，Post方式和Put方式也是相同的。
接著使用db.Delete(&model.User{}, ID)函數(shù)通過(guò)用戶結(jié)構(gòu)體做主鍵刪除。
至此，完成了用戶結(jié)構(gòu)體的增：用戶添加(唯一索引攔截)；刪(主鍵刪除)；改(動(dòng)態(tài)表單綁定修改密碼)；查(結(jié)構(gòu)體單項(xiàng)和批量查詢)。該項(xiàng)目已開(kāi)源在Github：https://github.com/zcxey2911/IrisBlog ，與君共觴，和君共勉。
