drf + vue全栈教程: 后端初试

作者:jacky
浏览:988

摘要:教程后端初体验,来啦!

经常关注的老读者可能发现了,把前端UI美化工具换掉了,换成了Ant Design的vue版本,因为element的导航栏不太合适,敬请谅解!

这篇文章,将带大家简单地体验一下django的模型,视图,以及drf特有的序列化!

首先,让我们进入跟目录,录执行命令创建django的第一个APP:

cd backend # 进入我们先前创建的djangoAPP的目录
python3 manage.py startapp blog # 创建我们一会要写后端代码的APP

然后注册我们这个APP到settings.py中:

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'rest_framework',
    'blog' # 新增
]

好了,正式开始写模型,视图和序列化。

模型

backend/blog/models.py中写入:

from django.db import models

class Article(models.Model):
    title = models.CharField(max_length=50)
    body = models.TextField()
    main = models.CharField(max_length=10000,blank=True)
    created = models.DateTimeField(auto_now_add=True)
    updated = models.DateTimeField(auto_now=True)

    class Meta:
        ordering = ('-created',)
        verbose_name = "文章 Article"

    def __str__(self):
        return self.title

如果你先前从没接触过django,这段内容还是有难度的,我一步步讲解:

  1. modles.py文件用来定义模型,写django为我们封装好的代码,这里我们创建了一个Article类,并给他定义了title,body,main,created,updated,还定义了排序方式和在后台中的名称,并要求他在后台显示时返回某条目的标题。
  2. created,updated这两个字段是和创建的日期,时间相关的内容,不需要太在意
  3. 内部类Meta定义了一下配置,这里是排序后台中的名称
  4. ·__str__表示在后台中返回的字段,这里返回title

注意:如果你学习此教程特别困难,可以先阅读django的官方文档进行学习

定义好模型后还有一件事要做,只有在命令行中执行命令,更改才会生效:

python3 manage.py makemigrations
python3 manage.py migrate

序列化

接着,我们对刚才定义的模型进行序列化。在blog目录下新建serializer.py,并写入:

from rest_framework import serializers
from .models import Article

class ArticleSerializer(serializers.ModelSerializer):
    class Meta:
        model = Article
        fields = [
            'id', 
            'title', 
            'body', 
            'main', 
            'created', 
            'updated',
            'column'
        ]

序列化可以理解成把数据转化为前端可以读取的格式,只需要写相应的字段,drf会帮我们字段序列化。

视图集

这里的视图我们直接使用视图集,如果读者想了解更多关于视图的写法,可以看文档,这里我们这么写:

from rest_framework import viewsets, mixins
from .serializer import ArticleSerializer
from .models import Article


class ArticleViewSet(viewsets.ModelViewSet):
    queryset = Article.objects.all()
    serializer_class = ArticleSerializer

看吧,代码就是这么短,因为drf已经帮我们封装好复杂的代码啦。这里,我们导入了模型和序列化器,并继承了所以常用类的封装。

除了知道怎么用外,我们也应该知道原理,是吧。所以,这里就简单告诉大家他的作用和前后端分离的原理。

作用:读取数据库内容并生成json格式的数据

原理:后端发送json格式的数据,前端读取数据并展示

好了,做完这个,我们还需要注册到路由中。编辑backend/backend/urls.py如下:

from blog.views import ArticleViewSet # 新增,从blog目录中导入视图集

router = DefaultRouter() # 已有代码
router.register(r'articles', ArticleViewSet, basename='article') # 新增,注册APP到api中

...

测试

最最激动人心的时刻到啦,我们重启服务,打开浏览器,访问http://127.0.0.1:8000/api/articles/,在下方的输入框中随便输入一些内容并提交,应该就可以看到这样的页面啦: aS6Ids.png

一则博主最近比较忙碌,二则遇到了一个前端的难题,所以教程更新会是龟速,读者们谅解下 有任何疑问欢迎加QQ群:Python学习交流 1140464262












登录后回复








共有9条评论


jacky 2个月前 评论:

后台里把浏览量改了哈,昨天下午好像经历了15分钟左右的爬虫


jacky 2个月前 评论:

wink​​​​加油呀​​​


弹尤克里里的测试er 2个月前 评论:

vue不容易呀


jacky 2个月前 评论:

啊,还是前端更困难crying


jacky 2个月前 评论:

新博客也快要来啦


jacky 2个月前 评论:

很快下一篇文章就会赶到devil


弹尤克里里的测试er 3个月前 评论:

coolcool


jacky 3个月前 评论:

博主正遇到一个前端传输数据的问题,还得要新建一个自己尝试的第二个项目,把坑踩一遍才能写教程crying


jacky 3个月前 评论:

最近真的好忙好忙啊angel





CopyRight © 2020 Jacky的编程空间

Powered by Django & Bootstrap  沪ICP备20019721号-1 本站总访问量