美文网首页
BVDNM-13 论坛功能(2)

BVDNM-13 论坛功能(2)

作者: 邵靖隆 | 来源:发表于2018-01-03 12:58 被阅读0次

    上一节里我们成功地看到了自己在后台建立的帖子。但是却不能点进去看,不能在网页上直接发帖,不能评论。这怎么行呢,所以现在我们就来完善这些功能。


    首先我们新建一个网页。当然了,仍然要有{% extends 'basemain.html' %}

    {% block title %} 发帖 {% endblock %}

    {% block title2 %} 发帖 {% endblock %}这三行。

    接下来,在block content里面输入如下内容

    发帖所需组件

    这就是我们发帖用的组建,它的实际效果是这样的:

    <div>发帖</div>

    接下来要写发帖按钮的响应函数,在block vuejs里面这么写:

    发帖函数

    写完这些后,前端的部分就写完了。接下来是后台部分,我们打开tool_03/view.py,开始写函数。这个函数的作用是对我们发的帖子进行接收和处理:

    函数一共有两部分

    此处值得注意的是:函数分为POST和GET两部分。当函数收到请求的时候,会先判断你发的请求(request)是POST还是GET,如果是GET(进入发帖页面时发送的request)则跳到下边去,返回发帖页面tool_03_01.html,反之则进入POST模块,对发来的帖子进行解析,并存入数据库。所以这个函数才会有两个return。

    这三部分都做完之后,发帖的通道基本上就调通了,我们可以发几个帖子玩玩

    界面还很丑

    对于界面的美化,各位可以看bootstrap教程(http://www.runoob.com/bootstrap/bootstrap-tutorial.html),并按照自己的口味来。(其实就是在标签里加几个class的事,我懒我就不加了反正是公司内网(滑稽))。

    评论功能

    在微博上,关闭评论是最气人的。不能评论的论坛,不能称之为论坛。就算作为一个纯粹的公告平台,不能评论的话怎么知道大家读了没有……总之就是该加上评论功能了。

    首先,不多废话,url.py里添上入口

    tool_03

    第一行是发帖,第二行是评论,美滋滋。然后我们先写一个空壳子函数让网站不报错

    空壳子函数

    接下来要开始正式编写评论功能。由于评论功能比发帖功能要复杂一些,所以这次先放出最终效果图

    上面看贴,下面评论

    看到了吗?最终效果分为三部分:上面看贴,中间写评论,下面看评论。也就是说我们任何部分的代码(Html/Bootstrap,VueJs,Django)都应该是三部分。

    首先是页面布局(Html/Bootstrap)

    第一部分

    注意当中的django-if模板。如果你没登陆,你当然是发不了评论的。所以要if一下。

    评论展示

    这里也有一个django-if,这是为了在作者自己发布的评论里加上(作者)标记。django-for的作用是按同样的布局显示出所有评论,和上一节讲的浏览所有帖子是一样的原理。布局写完之后,接下来就是vue的部分了。

    Vuejs

    注意看~仔细看!

    js代码里居然可以嵌套django的{{ 模板 }}?对的,没有错,就是可以嵌套。django模板是在后台对网页进行处理的,如果你学过C语言的话,用预编译来对这一过程进行描述再合适不过了。django是预编译,vue是正式编译。所以互不干扰。当网页发到用户手里的时候,{{ blog.id }}早已被替换成 10 之类的数字。

    当然这也有缺点,因为vue自己本身也有{{ 花括号绑定 }}的功能,当它和django一起使用的时候,这个功能就被django霸占了。你只能用<span v-text="要显示的变量">来实现了。

    当初这个坑我TM踩了好久!

    说多了都是泪。略过……

    接下来,在后台写评论函数

    别管tool_03

    tool_03是发帖函数,刚才我们写过了,不管。下边这个view_blog才是评论函数。同样的,它也分两部分,GET的部分用来看贴看评论,POST的部分用来发评论,用if进行判断,最终有两个return。以后所有的django函数基本上都会是这个样子,一个入口,一个if,两个部分,两个return。

    写完之后,这一切都可以正常运行了。自己发个帖,自己给自己评个论试试吧

    自己发帖自己评论

    ……看到自己给自己评论的那一刻突然感觉好寂寞。

    今天没有slogan。

    相关文章

      网友评论

          本文标题:BVDNM-13 论坛功能(2)

          本文链接:https://www.haomeiwen.com/subject/yqshnxtx.html