场景:老师表和学生表,老师表中使用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>