Django Vue渲染动态数据（七）

（一）批量添加数据

import random
from django.http import HttpResponse
def add_goods(request):
    ## 添加店铺
    store = Store.objects.create(s_name="生鲜店", s_logo="1.jpg", s_address="北京", s_description="北京生鲜店",
                                 s_user=QUser.objects.get(id=1))
    ## 添加类型
    goodstype = GoodsType.objects.create(t_name="生鲜", t_description="生鲜店",t_img="1.jpg")
    ## 增加100 条  
    goods_name = "芹菜、西芹、菠菜、香菜、茼蒿、茴香、生菜、苋菜、莴苣、葱、香葱、分葱、胡葱、楼子葱、蒜头、洋葱头、韭菜、韭葱、黄瓜、丝瓜、冬瓜、菜瓜、苦瓜、南瓜、栉瓜、西葫芦、葫芦、瓠瓜、节瓜、越瓜、笋瓜、佛手瓜"
    goods_name = goods_name.split("、")
    address = "北京市，天津市，上海市，重庆市，河北省，山西省，辽宁省，吉林省，黑龙江省，江苏省，浙江省，安徽省，福建省，江西省，山东省，河南省，湖北省，湖南省，广东省，海南省，四川省，贵州省，云南省，陕西省，甘肃省，青海省，台湾省"
    address = address.split("，")
    for n in range(10):
        for i, j in enumerate(range(10), 1):  ## i 是索引 代表下标从1开始
            goods = Goods()
            goods.g_number = str(i).zfill(5)  ## 返回指定长度的字符串   长度是5 
            goods.g_name = random.choice(address) + random.choice(goods_name)  ###从列表中随机取一个值  
            goods.g_price = round(random.random() * 100, 2)  ## 0到1 的小数  
            goods.g_num = random.randint(1, 100)
            goods.g_safe_date = random.randint(1, 12)
            goods.g_desription = "很好"
            goods.g_picutre = "images/goods.jpg"
            goods.g_type = goodstype
            goods.g_store = store
            goods.save()
    return HttpResponse("添加数据")

（二）返回数据的接口
返回12条数据

def goods(request):
    # 返回12条商品信息
    result = {
        "data":[
        ]
    }
    goods_list = Goods.objects.all()[:12].values("g_name","g_price","g_picutre")
    print(goods_list)
    for one in goods_list:
        result["data"].append(
            {"g_name": one["g_name"], "g_price": one["g_price"], "g_picutre": one["g_picutre"]}
        )

    return JsonResponse(result)

（三）Vue渲染数据
Vue 不能够完成数据的请求，只能够完成数据的绑定。请求数据需要使用vue-resource

    new Vue({
        el:"#content",
        data:{
            goods_list:[
                {"g_name":"进口柠檬1","g_price":"3.90","g_picutre":"images/goods/goods001.jpg"},
                {"g_name":"进口柠檬2","g_price":"3.90","g_picutre":"images/goods/goods001.jpg"},
                {"g_name":"进口柠檬3","g_price":"3.90","g_picutre":"images/goods/goods003.jpg"},
                {"g_name":"进口柠檬4","g_price":"3.90","g_picutre":"images/goods/goods001.jpg"},
                {"g_name":"进口柠檬5","g_price":"3.90","g_picutre":"images/goods/goods001.jpg"},
                {"g_name":"进口柠檬6","g_price":"3.90","g_picutre":"images/goods/goods001.jpg"},
                {"g_name":"进口柠檬7","g_price":"3.90","g_picutre":"images/goods/goods001.jpg"},
                {"g_name":"进口柠檬8","g_price":"3.90","g_picutre":"images/goods/goods001.jpg"}
            ]
        },
        created:function () {
            // 初始化 执行，请求数据
            var url = "http://127.0.0.1:8000/goods/";
            this.$http.get(url).then(   // 请求之后执行then
                function (data) {
                    console.log(data.data.data);
                    // 赋值   动态数据绑定的过程
                    {#console.log(this.data.goods_list);#}
                    this.goods_list = data.data.data;

                },  // 类似 ajax 中的 success
                function (error) {
                    console.log(error)
                } // 类似于ajax 中的  error
            )
            //  完成数据的绑定

        }
    })

二， FBV CBV
（一）FBV
视图，基于函数的视图，函数视图
处理 post ，put，delete 请求，需要使用csrftoken

def funcdemo(request):
    # 处理  GET请求
    if request.method == "GET":
        # 查询商品信息
        return JsonResponse({"method": "get"})

    if request.method == "POST":
        # 创建 商品
        return JsonResponse({"method": "post"})

    if request.method == "PUT":
        # 更新商品
        return JsonResponse({"method":"PUT"})

    if request.method == "DELETE":
        # 删除商品
        return JsonResponse({"method":"delete"})

（二）CBV
视图，基于类的视图，类视图

from django.views import View
class GoodsView(View):
    # 处理 get 请求
    def get(self,request):
        return JsonResponse({"methods":"get"})
    # 处理 post请求
    def post(self,request):
        return JsonResponse({"methods":"post"})
    # 处理 put请求
    def put(self,request):
        return JsonResponse({"methods":"put"})
    # 处理 delete请求
    def delete(self,request):
        return JsonResponse({"methods":"delete"})

路由设置

path('goodsview/', GoodsView.as_view()),

as_view原理？
​会根据请求方式的不同，做不同的处理，实际上调用了dispatch方法。dispatch方法，会将获取方式转化为小写，然后寻找类视图中的方法处理请求，并返回结果

三 CSRF拦截
跳过csrf校验
1在函数视图中使用

2在路由中使用

3在类视图中使用

（四）类视图案例

1，get方法
获取数据
1获取到12条数据
2传递id，获取指定id的商品

 def get(self, request):
        # 获取数据
        # 有参数 id
        self.result["methods"] = "get"
        id = request.GET.get("id")
        if id:
            # 处理有id
            goods_obj = Goods.objects.filter(id = id).first()
            self.result["data"]={
                "g_name": goods_obj.g_name,
                "g_number": goods_obj.g_number,
                "g_price": goods_obj.g_price,
                "g_description": goods_obj.g_description,
            }
        else:
            # 没有参数
            goods_list = Goods.objects.all()[:12]
            for one in goods_list:
                goods_obj = {
                    "g_name":one.g_name,
                    "g_number":one.g_number,
                    "g_price":one.g_price,
                    "g_description":one.g_description,
                }
                self.result["data"].append(goods_obj)
        return JsonResponse(self.result)

封装init方法

  def __init__(self):
        self.result =  {
            "code":"200",
            "msg":"success",
            "data":[],
            "methods":""
        }

2 post 方法
创建数据

扫描二维码关注公众号，回复： 12719770 查看本文章

   # 处理 post请求
    def post(self, request):
        # 创建数据
        # 获取数据
        data = request.POST
        # 添加数据
        goods_obj = Goods()
        goods_obj.g_name = data.get("g_name")
        # 其他的属性赋值  待完成
        goods_obj.save()

        self.result["methods"] = "post"
        return JsonResponse(self.result)

3 put方法
更新数据
id通过获取id，确定更改那条信息
获取到要更新的内容

视图获取数据

  def put(self, request):
        # 更新数据
        data = request.body  # bytes 类型
        data = request.body.decode()  # 字符串类型 json   "{name:name}"
        import json
        data = json.loads(request.body.decode())   # 字典
        id = data.get("id")
        g_name = data.get("g_name")
        g_price = data.get("g_price")
        print(g_name)
        # 更新操作
        Goods.objects.filter(id = id).update(g_name = g_name,g_price = g_price)
        return JsonResponse({"methods": "put"})

更新数据的内容不确定，获取的参数不确定

    # 处理 put请求
    def put(self, request):
        # 更新数据
        data = request.body  # bytes 类型
        data = request.body.decode()  # 字符串类型 json   "{name:name}"
        import json
        #  第一种
        data = json.loads(request.body.decode())
        id = data.get("id")
        goods = Goods.objects.filter(id = id).first()
        # goods.g_name = data.get("g_name")
        #  setattr 为对象设置属性
        data.pop("id")
        for key,value in data.items():
            # 设置属性   为对象重新赋值  修改
            # 判断 获取到的key 是否为对象的属性
            if hasattr(goods,key):
                setattr(goods,key,value)
        goods.save()
        return JsonResponse(self.result)

第二种 解包

    # 解包
        data = json.loads(request.body.decode())
        # 字典 {"g_name":xxx,"g_price":"}   -> g_name = "xxxx", g_price = "xx"
        id = data.get("id")
        data.pop("id")
        # 修改数据
        Goods.objects.filter(id = id).update(**data)

delete方法
获取id删除数据，数据从body中获取

 def delete(self, request):
        # 删除数据
        import json
        id = json.loads(request.body.decode()).get("id")
        Goods.objects.filter(id = id).delete()

        return JsonResponse({"methods": "delete"})

三 Django Rest FrameWork
是一个Django的功能组件，目的快速搭建一个满足restful风格的api接口
DJango 的功能组件都是以app的形式存在
（一）安装
pip install djangorestframework
注册app

官网： https://www.django-rest-framework.org/

序列化器
序列化器对数据进行序列化，将Python中的类型，序列化为JSON

# 序列化器
# 搭建一个关于 Goods的api接口
from rest_framework import serializers
from .models import Goods

# 商品的序列化器
class MoreListSerializer(serializers.ModelSerializer):
    class Meta:
        model = Goods    # 要序列化的模型
        # 要序列化的字段
        fields = "__all__"   # 所有 序列化模型中的所有字段
        # fields = ["g_name","g_price"]

（三）视图类
1、ApiView
ApiView 对 类视图继承的父类 View 进行了封装，能够快速搭建一个rest接口
视图

from rest_framework.views import APIView,Response
from .serializer import MoreListSerializer
class MorelistView(APIView):
    # 处理get 请求
    def get(self,request):
        # 返回10条数据
        goods_list = Goods.objects.all()[:10]
        serializer = MoreListSerializer(goods_list,many=True)  # many =True结果中使用列表的形式 多个
        result = serializer.data  # 要返回的数据
        return Response(result)

路由

path("morelist/",MorelistView.as_view())

访问

2mixins

视图

from rest_framework import mixins,generics
class MorelistView(mixins.ListModelMixin,generics.GenericAPIView):
    def get_queryset(self):
        # 获取到一个queryset 结果
        # goods_list = Goods.objects.all()[:10]
        # 返回某个商品类型的10条数据
        type_id = self.request.GET.get("type_id")
        goods_list = GoodsType.objects.filter(id = type_id).first().goods_set.all()
        return goods_list
    # 序列化器
    serializer_class = MoreListSerializer

    def get(self,request, *args, **kwargs):
        # 处理get 请求
        return self.list(request, *args, **kwargs)
    # 返回数据  让结果保持原有的样子
    def get_serializer_context(self):
        return {
            "view":self
        }

路由

path("morelist/",MorelistView.as_view()),

3通用视图类
视图

from rest_framework import generics
class MorelistView(generics.ListAPIView):
    def get_queryset(self):
        # 获取到一个queryset 结果
        # goods_list = Goods.objects.all()[:10]
        # 返回某个商品类型的10条数据
        type_id = self.request.GET.get("type_id")
        goods_list = GoodsType.objects.filter(id = type_id).first().goods_set.all()
        return goods_list
    # 序列化器
    serializer_class = MoreListSerializer

    # 返回数据  让结果保持原有的样子
    def get_serializer_context(self):
        return {
            "view":self
        }

路由

path("morelist/",MorelistView.as_view()),

4、ViewSet 类 和路由器
视图

from rest_framework import viewsets
class MorelistView(viewsets.ReadOnlyModelViewSet):
    def get_queryset(self):
        # 获取到一个queryset 结果
        # goods_list = Goods.objects.all()[:10]
        # 返回某个商品类型的10条数据
        type_id = self.request.GET.get("type_id")
        goods_list = GoodsType.objects.filter(id = type_id).first().goods_set.all()
        return goods_list
        # 序列化器
    serializer_class = MoreListSerializer

    # 返回数据  让结果保持原有的样子
    def get_serializer_context(self):
        return {
            "view":self
        }

路由

more_list = MorelistView.as_view(
    {'get': 'list'}
)

urlpatterns = [
    path('admin/', admin.site.urls),
    path("morelist/", more_list),
]

路由器
提供了路由器

访问：

http://127.0.0.1:8000/api/morelist/?type_id=1