06-素材管理-删除素材
- 点击删除图标
- 获取当前图片的ID
- 发送删除请求
- 成功:提示+更新列表
div盒子中绑定事件:
<span @click="delImage(item.id)" class="el-icon-delete"></span>
- messagebox消息提示弹框组件-确认消息模式:
组件网址:messagebox消息提示弹框组件-确认消息模式
https://element.eleme.cn/#/zh-CN/component/message-box
methods中删除方法:
// 删除图片
delImage (id) {
this.$confirm('此操作将永久删除该图片, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(async () => {
await this.$http.delete(`user/images/${id}`)
// 成功, 发异步请求,外层函数加async
this.$message.success('删除图片成功')
this.getImages()
}).catch(() => {
//点取消,什么也不做
})
},