vue + django 批量删除

简单的代码逻辑

views.py

# 批量删除
class Pdels(APIView):
    def post(self,request):
        id = request.data.get('piliang')  #获取前端传过来的值
        ss=Stu.objects.filter(id__in=id).delete()  #去表里查询  前端的id是否在 表里的id字段中 id__in

        if not ss:          #如果不在 
　　　　　　　　#返回给前端信息
            return Response({'code': 10020, 'message': '删除失败'})
　　　　　　#如果在 返回给前端信息
        return Response({'code':200,'message':'删除成功'})

vue 代码
写一个input 复选框的模式

<h1>展示学生</h1>
<table border="1">
    <tr>
        <td>学生姓名</td>
        <td>学生照片</td>
        <td>操作</td>
        <td>多选</td>
        <td>修改</td>
    </tr>
    <tr v-for="i in aa">
        <td>{{i.name}}</td>
        <td><img :src="'http://127.0.0.1:8000/'+i.img"  height="100"></td>
        <td><button v-on:click="dels(i.id)">删除</button></td>
        <td><input type="checkbox" v-model="piliang" :value="i.id">批量删除</td>
        <td><router-link :to="{'name':'uploads',params:{'id':i.id}}">修改</router-link></td>

    </tr>

<button v-on:click="delsa">批量删除</button>  写一个按钮的点击事件

</table>

在初始化赋值  

export default {
    name: "showstu",
    components: {
        showstu2:showstu2
    },
    data:function () {
        return{
            piliang:[],

        }
    },

执行点击事件

    delsa:function () {
       this.axios({  
        url:'/api/a/pdels/', //后台接口
        data:{'piliang':this.piliang},  // 传给后台的值
        method:'post'
    }).then(res=>{
        console.log(res)  //在页面中打印后台传给前端的信息
        if (res.data.code==200){
            alert(res.data.message)  alert 后端正确的信息
            this.$router.go()  //刷新页面
        }else{      // alert  后端的错误信息

            alert(res.data.message)
        }
    }).catch(err=>{

    })
    }
}