django多对多

场景：老师表和学生表，老师表中使用ManyToManyField关联学生表

models.py

# 学生表
class Student(models.Model):
    name = models.CharField(max_length=50)
    age = models.IntegerField()

    class Meta:
        db_table = 'student'

# 老师表
class Teacher(models.Model):
    name = models.CharField(max_length=50)
    age = models.IntegerField()
    stu = models.ManyToManyField(Student)

    class Meta:
        db_table = 'teacher'

学生表没有外键，所以直接使用序列化添加即可

class StudentSer(serializers.ModelSerializer):
    class Meta:
        model = Student
        fields = '__all__'

class AddStudent(APIView):
    def get(self,request):
        ser = StudentSer(data=request.data)
        print(ser)
        if ser.is_valid():
            ser.save()
            res = {}
            res['code'] = 200
            res['message'] = '添加成功'
            return Response(res)
        else:
            res = {}
            res['code'] = 400
            res['message'] = '添加失败'
            return Response(res)

老师表存在外键，所以用反序列化添加

class TeacherSer(serializers.Serializer):
    name = serializers.CharField(max_length=50)
    age = serializers.IntegerField()
    stu = serializers.CharField()
    def create(self, data):
        stu = data.pop('stu')  # 将外键弹出
        ss = stu.split(',')   #使用字符串切割
        teacher = Teacher.objects.create(**data)   # 存储老师字段
        teacher.stu.set(ss)  # 存储teacher表的外键
        return teacher

class AddTeacher(APIView):
    def post(self,request):
        ser = TeacherSer(data=request.data)
        if ser.is_valid():
            ser.save()
            res = {}
            res['code'] = 200
            res['message'] = '添加成功'
            return Response(res)
        else:
            res = {}
            res['code'] = 400
            res['message'] = '添加失败'
            return Response(res)

使用postman测试添加老师的时候，外键栏不需要传入列表,否则报错，因为从前端传过来的是字符串，在前端多选的时候是选值，所以直接加外键id即可

<template>
    <div>
      老师名：<input type="text" v-model="name"><br>
      年龄：<input type="text" v-model="age"><br>
      他的学生：
      <select multiple v-model="stus">
        <option v-for="item in datalist" :value="item.id">{{ item.name }}</option>
      </select><br>
      <button @click="adds">添加</button>
    </div>
</template>

<script>
  import axios from 'axios'
    export default {
        data(){
          return{
            name:'',
            age:'',
            datalist:[],
            stus:[],
          }
        },
      mounted() {
          axios({
            url:'http://localhost:8000/showstu/',
            method:'get'
          }).then(res=>{
            console.log(res);
            this.datalist = res.data.data;
          })
      },
      methods:{
          adds(){
            let form_data = new FormData();
            form_data.append('name',this.name);
            form_data.append('age',this.age);
            form_data.append('stu',this.stus);
            axios({
               url:'http://localhost:8000/addteacher/',
               method:'post',
              data:form_data
            }).then(res=>{
              console.log(res);
            })
          }
      }
    }
</script>

<style scoped>

</style>