正文：话不多说，直接上代码
- springboot代码
/**
* 根据id修改当前登录用户的信息
*
* @param username
* @return
*/
@GetMapping("/username/{username}")
public Result findOne(@PathVariable String username) {
QueryWrapper<User> queryWrapper = new QueryWrapper<>();
queryWrapper.eq("username", username);
return Result.success(userService.getOne(queryWrapper));
}
//新增或更新
@PostMapping("/save")
public Result save(@RequestBody User user) {
return Result.success(userService.saveOrUpdate(user));
}
- 页面代码
<el-card style="width: 500px;">
<el-form label-width="80px" size="small">
<el-form-item label="用户名">
<el-input v-model="form.username" disabled autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="昵称">
<el-input v-model="form.nickname" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="邮箱">
<el-input v-model="form.email" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="电话">
<el-input v-model="form.phone" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="地址">
<el-input type="textarea" v-model="form.address" autocomplete="off"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="save">确 定</el-button>
</el-form-item>
</el-form>
</el-card>
- 获取保存在浏览器的用户信息
data () {
return {
form: {},
user: localStorage.getItem("user") ? JSON.parse(localStorage.getItem('user')) : {},
}
},
- create代码
created () {
this.request.get("/user/username/" + this.user.username).then(res => {
if (res.code === '200') {
this.form = res.data
}
})
},
- methods代码
methods: {
save () {
this.request.post("/user/save", this.form).then(res => {
if (res.code === '200') {
this.$message.success("保存成功")
} else {
this.$message.error("保存失败")
}
})
},
}