vue+jsp+删除一个bean

1.无分页查询
2.有分页查询
3.增加
4.删除
5.修改

前三项已经完成了,接下来做第四项,删除功能

页面代码

{{bean.classid}}
{{bean.classname}}
{{bean.classmsg}}

删除

--关键就是a标签的写法,和过去的写法几乎一样,时间绑定到vue的事件就可以了。
删除
删除
即从click事件修改为v-on:click事件

methods:{

​ deleteBean(classid){

​ }

}

--注意,这个是rest请求bean/id

--用到了之前提到过的post,get,delete,put请求

--这里第一次应用delete请求

--get和post是学习的重点,delete和put了解就可以

deleteBean: function (id) {

            var url = "class/"+id;
            axios.delete(url).then(function(response){
                vue.list(1);

​ //成功后刷新
​ });
},

back code as below

@DeleteMapping("/class/{classid}") // 删除一个bean
public String delete(com.zz.entity.Class c) throws Exception {
    classService.deleteByPrimaryKey(c.getClassid());
    return "success";
}

page effect as below

点击删除按钮,会删除选中的元素

你可能感兴趣的:(springboot,vue.js)