一、原理

#多级评论原理简单原理,弄完之后发现基础白学了

msg_list = [

    {'id':1,'content':'xxx','parent_id':None},

    {'id':2,'content':'xxx','parent_id':None},

    {'id':3,'content':'xxx','parent_id':None},

    {'id':4,'content':'xxx','parent_id':1},

    {'id':5,'content':'xxx','parent_id':4},

    {'id':6,'content':'xxx','parent_id':2},

    {'id':7,'content':'xxx','parent_id':5},

    {'id':8,'content':'xxx','parent_id':3},

]

#python里面的apend之类的东西都是引用的原来数据的内从地址,对原数据进行操作的话

#我们引用的数据也会发生一样的变化(字典列表之类的)

#骗子的方法

# for i in msg_list:

#     i['child']=[]

# for i in range(len(msg_list)-1,-1,-1):

#     if msg_list[i]['parent_id']:

#         msg_list[msg_list[i]['parent_id'] - 1]['child'].append(msg_list[i])

# new_msg_list = [i for i in msg_list if i['parent_id'] is None]

# print(new_msg_list)

#老师讲的方法

# v=[row.setdefault('child',[]) for row in msg_list] #这和地下的第一个for循环的作用是一样的,给每一个元素加一个'child':[]

# print(msg_list)

#如果我们想加快索引(快点找到数据的话)就建一个字典的数据结构

msg_list_dict={} #加快索引,节省时间

for item in msg_list:

    item['child']=[]

    msg_list_dict[item['id']]=item #字典中key为item['id']，value为item

    #把字典数据结构填上数据,能够加快索引,而且我们数据还是占得原来的内从空间

    #我们只是引用了数据的内容空间,所以不存在新的数据结构浪费空间一说

result=[]

for item in msg_list:

    pid=item['parent_id']

    if pid: #如果parent_id不为空,说明它是子级,要把自己加入对应的父级

        msg_list_dict[pid]['child'].append(item)

    else: #如果为空,说明他是父级,要把它单独领出来用

        result.append(item)

#result就是我们最终要的结果,因为这里面全是引用,所有数据的内存地址都没有变

#只不过被多个数据结构引用了而已

print(result)

二、精简版

views代码

def comments(request,nid):

    res={'status':True,'data':None,'msg':None}

    try:

        comment_list = models.Comment.objects.filter(article_id=nid).values()

        com_list = list(comment_list)  # 所有的评论,列表套字典

        com_list_dict = {}  # 建立一个方便查找的数据结构字典

        for item in com_list:  # 循环评论列表,给每一条评论加一个child:[]就是让他装对他回复的内容

            item['create_time'] = str(item['create_time'])

            item['child'] = []

            com_list_dict[item['nid']] = item

        result = []

        for item in com_list:

            rid = item['reply_id']

            if rid:  # 如果reply_id不为空的话,那么就是说明他是子评论,我们要把他加入对应的评论后面

                com_list_dict[rid]['child'].append(item)

            else:

                result.append(item)

        print(result)

        # comment_str = comment_tree(result)

        # 这是在服务器上递归完之后,然后在传到前端,但是这样会增加服务器压力

        #所以这种方式我们直接就不用了

        res['data']=result

    except Exception as e:

        res['status']=False

        res['mag']=str(e)

    return HttpResponse(json.dumps(res))

HTML代码

<style>

    .comment{

        margin-left:20px;

        }

</style>

<body>

    <div id="commentArea">

    </div>

</body>

<script src="/static/jquery-3.2.1.js"></script>

<script>

        //自定义JS中字符串格式化方法

        String.prototype.Format=function (arg) {

            //console.log(this,arg); //this,当前调用方法的字符串，arg为Format方法传入的参数

            //return '666'; //return，格式化之后获取的新内容，return啥就替换为啥

            var temp = this.replace(/\{(\w+)\}/g,function (k,kk) {

                // k相当于{(\w+)},kk相当于(\w+)要替换的东西,arg一般是一个字典

                return arg[kk];

            });

            return temp;

        };

        $(function () {

            //发送Ajax请求，获取所有评论的信息

            //列表

            //JS生成结构

             var token=$.cookie('csrftoken');

             $.ajax({

                 url:"/comments-{{ article_obj.nid }}.html",

                 type:"GET",

                 dataType:"JSON",

                 success:function (arg) {

                     if (arg.status){

                         var comment=commentTree(arg.data);

                         $('#commentArea').append(comment);

                     }else{

                         alert(arg.msg);

                     }

                 }

             })

        });

        //多级评论递归函数,js函数里面也有return,自己写js字符串格式化

        //pyhton中字符串的方法都是str下的,js中是String.prototype下找的

        function commentTree(commentList) {

            var comment_str="<div class='comment'>";

            $.each(commentList,function (k,row) {

                var temp="<div class='content'>{content}</div>".Format({content:row.content});

                comment_str += temp;

                if (row.child.length>0){

                    comment_str += commentTree(row.child);

                }

            });

            comment_str += '</div>';

            return comment_str

        }

</script>

　　

Django多级评论的更多相关文章

  1. Django 项目补充知识（JSONP,前端瀑布流布局，组合搜索，多级评论）

    一.JSONP 1浏览器同源策略 通过Ajax,如果在当前域名去访问其他域名时,浏览器会出现同源策略,从而阻止请求的返回 由于浏览器存在同源策略机制,同源策略阻止从一个源加载的文档或脚本获取或设置另一 ...

  2. python运维开发(二十二)---JSONP、瀑布流、组合搜索、多级评论、tornado框架简介

    内容目录: JSONP应用 瀑布流布局 组合搜索 多级评论 tornado框架简介 JSONP应用 由于浏览器存在同源策略机制,同源策略阻止从一个源加载的文档或脚本获取或设置另一个源加载的文档的属性. ...

  3. python自动化开发-[第二十二天]-bbs多级评论、点赞、上传文件

    今日概要: 1.related_name和related_query_name的区别 2.through_fields的用途 3.django的事务提交 4.点赞的动画效果 5.多级评论的原理 6.上 ...

  4. day20 project+查看新闻列表 + 点赞 + 图片验证码 + 评论和多级评论 + 后台管理 + webSocket + kindEditor

    Day20回顾: 1. 请求生命周期 2. 中间件 md = [ "file_path.classname" ] process_request[可有可无] process_res ...

  5. jsonp、瀑布流布局、组合搜索、多级评论（评论树）、Tornado初识

    1.JSONP原理剖析以及实现 1.1 同源策略限制 用django分别建立两个项目,jsonp01和jsonp02,然后再在这两个项目里分别建立一个app,比如名字叫jsonp1.jsonp2:js ...

  6. Python or JavaScript 实现多级评论

    Python or JavaScript 实现多级评论 Python 实现 Js 实现

  7. [个人网站搭建]·Django增加评论功能(Python3)

    [个人网站搭建]·Django增加评论功能 个人主页--> https://xiaosongshine.github.io/ 个人网站搭建github地址:https://github.com/ ...

  8. django中的多级评论

    需求分析 一般论坛中有评论和子评论,这样很容易就成了一个评论树,比如以下情况,先看数据结构: #nid,评论内容,跟帖对象(None为根评论) (1, '111', None), (2, '222', ...

  9. 潭州课堂25班：Ph201805201 django 项目 第二十五课 文章多级评论前后台实现 (课堂笔记）

    添加新闻评论功能 1.分析 业务处理流程: 判断前端传的新闻id是否为空,是否为整数.是否不存在 判断评论的内容是否为空 判断是否有父评论,父评论的id是否与新闻id匹配 判断用户是否登录 保存新闻评 ...

随机推荐

  1. ASP.NET MVC上传图片的奇怪问题

    本文来源于博客园-钱智慧,转载请注明出处 表现:客户说就华为的手机有问题,而且是在QQ里打开有问题,如果在手机的浏览器上,则可以正常上传图片. 有问题的代码如下: private ResultMode ...

  2. 你不知道的Google控制台

    1.页面可编辑 document.body.contentEditable=true 2.console.table() 3.console.dir 4.clear() 清空控制台 5.sources ...

  3. 国内可用的Internet时间同步服务器地址（NTP时间服务器）

    不知道什么鬼我这系统自带的Internet时间同步服务器地址居然不可用,终端ping系统自带服务器两个居然都不通???难道时间服务器也和谐么? 好在阿里云提供了7个NTP时间服务器也就是Interne ...

  4. JQuery代码实现上拉加载（不使用插件）

    <script type="text/javascript"> $(window).scroll(function() { //已经滚动到上面的页面高度 var sl_ ...

  5. js面向对象的理解

    ECMAScript 有两种开发模式:1.函数式(过程化),2.面向对象(OOP).面向对象的语言有一个标志,那就是类的概念,而通过类可以创建任意多个具有相同属性和方法的对象.但是,ECMAScrip ...

  6. oracle 常用sql字符函数介绍

    常用字符函数介绍 1.ascii 返回与指定的字符对应的十进制数: SQL>select ascii('A') A,ascii('a') a,ascii('0') zero,ascii(' ') ...

  7. 『BUG』Android Studio 64位 始终提示 JVM 启动不了，JDK配置失败，error code -1

    前几天 安装了 Android Studio 2.2. 本来一切都好,但是当我修改了 配置文件 studio64.exe.vmoptions 想修改 最大内存(保证运行流畅)后,AS 就再也运行不了了 ...

  8. oracle导出dmp文件的2种方法

    使用exp和expdp导出数据 1.exp导出数据命令 exp gd_base/@192.168.13.211/oanet file=D:\export\gd_base.dmp log=D:\expo ...

  9. 第二次作业：软件分析之Steam的前世今生

    摘要:本次作业我将介绍一下Steam的相关内容,以及对Steam的相关调研测评,以及需求分析,最后就是对Steam的建议以及在中国的发展提出相应的建议 一.相关信息      Steam是一个整合游戏 ...

  10. 【Alpha版本】冲刺阶段 - Day3 - 逆风

    今日进展 袁逸灏:右上角两个按键的添加与实现监听(5h) 刘伟康:继续借鉴其他 alpha 冲刺博客,由于我们组的App原型可以在 alpha 阶段完成,所以不需要墨刀工具展示原型(2h) 刘先润:更 ...