【VUE】案例：商场会员管理系统

编写vue+dfr实现对会员进行基本增删改查

1. drf项目初始化

• 请求：

  POST
  http://127/0.0.0.1:8000/api/auth/
  {"username":"cqn", "password":"123"}
  

• 返回：

  {"username":"cqn", "token":"fwjkfbj"}
  

• 创建项目
  

• 项目目录结构
  

1.1 安装并注册drf

• pip install djangorestframework
• settings.py

  INSTALLED_APPS = [
      ...
      'django.contrib.staticfiles',
      'api.apps.ApiConfig',
      'rest_framework',
  ]
  

1.2 创建数据库表并添加数据

• models.py

  from django.db import models
  
  class UserInfo(models.Model):
      username = models.CharField(verbose_name="用户名", max_length=64)
      password = models.CharField(verbose_name="密码", max_length=64)
      token = models.CharField(verbose_name="token", max_length=64, null=True, blank=True)
  

• makemigrations
• migrate
• 插入两条数据“root 123”，“cqn 123”

1.3 创建apiview文件

views/account.py

import uuid
from rest_framework import serializers
from rest_framework.views import APIView
from rest_framework.response import Response
from api import models

class AuthSerializer(serializers.Serializer):
    username = serializers.CharField(required=True)
    password = serializers.CharField(required=True)

class AuthView(APIView):
    def post(self, request):
        # 1. 获取用户提交数据 request.data = {"username": "xxx", "password": "...}
        # 2. 表单校验
        ser = AuthSerializer(data=request.data)
        if not ser.is_valid():
            return Response({
   
   "code": 1000, "msg": "校验失败", "detail": ser.errors})
        # 3. 数据库校验
        user_object = models.UserInfo.objects.filter(**ser.data).first()
        if not user_object:
            return Response({
   
   "code": -1, "msg": "用户名或密码错误"})
        token = uuid.uuid4()
        user_object.token = token
        user_object.save()
        # 4. 数据返回
        return Response({
   
   
            "code": 0,
            "data": {
   
   "id": user_object.id, "name": user_object.username, "token": user_object.token}