抽屉实现评论数据结构及评论内容显示示例
Posted lbzbky
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了抽屉实现评论数据结构及评论内容显示示例相关的知识，希望对你有一定的参考价值。
1.实现评论数据结构两种方式
（1）循环实现评论数据结构（推荐）
（2）js递归实现评论数据结构
2.显示评论内容两种方式
（1）js递归显示评论内容（推荐）
前端进行递归实现
（2）simple_tag递归显示评论内容
render + simple_tag
前端直接after指定位置
1 from django.shortcuts import render,HttpResponse 2 from app01 import models 3 4 def index(request): 5 return render(request, ‘index.html‘) 6 #循环实现评论数据结构(推荐） 7 def comment(request): 8 news_id = request.GET.get(‘news_id‘) 9 # models.xxx.filter(news_id=news_id).values(...) 10 comment_list = [ 11 ‘id‘: 1, ‘content‘: ‘Python最牛逼‘, ‘user‘: ‘搞基建‘, ‘parent_id‘: None, 12 ‘id‘: 2, ‘content‘: ‘Java最牛逼‘, ‘user‘: ‘搞基建‘, ‘parent_id‘: None, 13 ‘id‘: 3, ‘content‘: ‘php最牛逼‘, ‘user‘: ‘搞基建‘, ‘parent_id‘: None, 14 ‘id‘: 4, ‘content‘: ‘你最牛逼‘, ‘user‘: ‘小比虎‘, ‘parent_id‘: 1, 15 ‘id‘: 5, ‘content‘: ‘老师最你比‘, ‘user‘: ‘李欢‘, ‘parent_id‘: 1, 16 ‘id‘: 6, ‘content‘: ‘郭永昌是...‘, ‘user‘: ‘郭永昌‘, ‘parent_id‘: 4, 17 ‘id‘: 7, ‘content‘: ‘哈哈我是流氓...‘, ‘user‘: ‘崔月圆‘, ‘parent_id‘: 2, 18 ‘id‘: 8, ‘content‘: ‘我女朋友好漂亮...‘, ‘user‘: ‘崔月圆‘, ‘parent_id‘: 3, 19 ‘id‘: 9, ‘content‘: ‘见到你女友，交定你朋友...‘, ‘user‘: ‘搞基建‘, ‘parent_id‘: 8, 20 ‘id‘: 10, ‘content‘: ‘见到你女友，交定你朋友...‘, ‘user‘: ‘鼻环‘, ‘parent_id‘: None, 21 ‘id‘: 11, ‘content‘: ‘我是大胖...‘, ‘user‘: ‘xiaopang‘, ‘parent_id‘: 6, 22 ] 23 comment_tree = [] 24 comment_list_dict = 25 for row in comment_list: 26 row.update(‘children‘: []) 27 comment_list_dict[row[‘id‘]] = row 28 for item in comment_list: 29 parent_row = comment_list_dict.get(item[‘parent_id‘]) 30 if not parent_row: 31 comment_tree.append(item) 32 else: 33 parent_row[‘children‘].append(item) 34 35 import json 36 return HttpResponse(json.dumps(comment_tree)) #JS递归显示评论内容（推荐） 37 #return render(request, ‘comment.html‘, ‘comment_tree‘: comment_tree) #simple_tag递归显示评论内容
1 from django.shortcuts import render,HttpResponse 2 from app01 import models 3 #递归实现评论数据结构（不推荐） 4 class Node: 5 @staticmethod 6 def digui(ret, row): 7 # ret: ‘id‘: 4, ‘content‘: ‘你最牛逼‘, ‘user‘: ‘小比虎‘, ‘parent_id‘: 1, ‘children‘: [],‘id‘: 5, ‘content‘: ‘老师最你比‘, ‘user‘: ‘李欢‘, ‘parent_id‘: 1,] 8 # row ‘id‘: 6, ‘content‘: ‘郭永昌是...‘, ‘user‘: ‘郭永昌‘, ‘parent_id‘: 4, 9 for rt in ret: 10 if rt[‘id‘] == row[‘parent_id‘]: 11 row[‘children‘] = [] 12 rt[‘children‘].append(row) 13 return 14 else: 15 Node.digui(rt[‘children‘],row) 16 17 @staticmethod 18 def create_tree(comment_list): 19 ret = [] 20 """ 21 ‘user‘: ‘搞基建‘, ‘parent_id‘: None, ‘id‘: 1, ‘children‘: [‘id‘: 4, ‘content‘: ‘你最牛逼‘, ‘user‘: ‘小比虎‘, ‘parent_id‘: 1, ‘children‘: [],‘id‘: 5, ‘content‘: ‘老师最你比‘, ‘user‘: ‘李欢‘, ‘parent_id‘: 1,], ‘content‘: ‘Python最牛逼‘ 22 ‘user‘: ‘搞基建‘, ‘parent_id‘: None, ‘id‘: 2, ‘children‘: [], ‘content‘: ‘Java最牛逼‘ 23 ‘user‘: ‘搞基建‘, ‘parent_id‘: None, ‘id‘: 3, ‘children‘: [], ‘content‘: ‘PHP最牛逼‘ 24 """ 25 for row in comment_list: 26 # row ‘id‘: 6, ‘content‘: ‘郭永昌是...‘, ‘user‘: ‘郭永昌‘, ‘parent_id‘: 4, 27 if not row[‘parent_id‘]: # None 28 row[‘children‘] = [] 29 ret.append(row) 30 else: 31 Node.digui(ret,row) 32 return ret 33 34 def comment(request): 35 news_id = 1 36 37 # comment_list = models.Comment.objects.filter(news_id=news_id) 38 # for row in comment_list: 39 # print(row.id,row.content,row.user_info.name,row.parent_id) 40 comment_list = [ 41 ‘id‘: 1, ‘content‘: ‘Python最牛逼‘, ‘user‘: ‘搞基建‘, ‘parent_id‘: None, 42 ‘id‘: 2, ‘content‘: ‘Java最牛逼‘, ‘user‘: ‘搞基建‘, ‘parent_id‘: None, 43 ‘id‘: 3, ‘content‘: ‘PHP最牛逼‘, ‘user‘: ‘搞基建‘, ‘parent_id‘: None, 44 ‘id‘: 4, ‘content‘: ‘你最牛逼‘, ‘user‘: ‘小比虎‘, ‘parent_id‘: 1, 45 ‘id‘: 5, ‘content‘: ‘老师最你比‘, ‘user‘: ‘李欢‘, ‘parent_id‘: 1, 46 ‘id‘: 6, ‘content‘: ‘郭永昌是...‘, ‘user‘: ‘郭永昌‘, ‘parent_id‘: 4, 47 ‘id‘: 7, ‘content‘: ‘哈哈我是流氓...‘, ‘user‘: ‘崔月圆‘, ‘parent_id‘: 2, 48 ‘id‘: 8, ‘content‘: ‘我女朋友好漂亮...‘, ‘user‘: ‘崔月圆‘, ‘parent_id‘: 3, 49 ‘id‘: 9, ‘content‘: ‘见到你女友，交定你朋友...‘, ‘user‘: ‘搞基建‘, ‘parent_id‘: 8, 50 ‘id‘: 10, ‘content‘: ‘见到你女友，交定你朋友...‘, ‘user‘: ‘鼻环‘, ‘parent_id‘: None, 51 ] 52 """ 53 comment_tree = Node.create_tree(comment_list) 54 for i in comment_tree: 55 print(i) 56 """ 57 # hash_comment_list = 58 # for m in range(len(comment_list)): 59 # comment_list[m].update(‘children‘:[]) 60 # hash_comment_list[comment_list[m][‘id‘]] = comment_list[m] 61 # # print(hash_comment_list) 62 # ret = [] 63 # for i in range(len(comment_list)): 64 # node = comment_list[i] 65 # pnode = hash_comment_list.get(node[‘parent_id‘]) 66 # if pnode: 67 # pnode[‘children‘].append(node) 68 # else: 69 # ret.append(node) 70 # print(ret) 71 72 # hash_comment_list = 73 # for item in comment_list: 74 # item.update(‘children‘: []) 75 # hash_comment_list[item[‘id‘]] = item 76 # # print(hash_comment_list) 77 # ret = [] 78 # for row in comment_list: 79 # node = row 80 # pnode = hash_comment_list.get(node[‘parent_id‘]) 81 # if pnode: 82 # pnode[‘children‘].append(node) 83 # else: 84 # ret.append(node) 85 # print(comment_list) 86 # print(ret) 87 88 89 # for i in comment_list: 90 # i.update(‘children‘: []) 91 # 92 # for i in comment_list: 93 # if i[‘id‘] == 5: 94 # i[‘children‘].append(i) 95 # 96 # for i in comment_list: 97 # print(i) 98 99 """ 100 [ 101 102 ‘id‘: 1, 103 ‘content‘: ‘Python最牛逼‘, 104 ‘user‘: ‘搞基建‘, 105 ‘parent_id‘: None, 106 ‘children‘: [ 107 ‘id‘: 4, ‘content‘: ‘你最牛逼‘, ‘user‘: ‘小比虎‘, ‘parent_id‘: 1, ‘children‘: [ 108 ‘id‘: 6, ‘content‘: ‘郭永昌是...‘, ‘user‘: ‘郭永昌‘, ‘parent_id‘: 4, ‘children‘: [], 109 ], 110 ‘id‘: 5, ‘content‘: ‘老师最你比‘, ‘user‘: ‘李欢‘, ‘parent_id‘: 1, ‘children‘: [], 111 ] 112 , 113 114 ‘id‘: 2, 115 ‘content‘: ‘Python最牛逼‘, 116 ‘user‘: ‘搞基建‘, 117 ‘parent_id‘: None, 118 ‘children‘: [] 119 , 120 121 ‘id‘: 3, 122 ‘content‘: ‘Python最牛逼‘, 123 ‘user‘: ‘搞基建‘, 124 ‘parent_id‘: None, 125 ‘children‘: [] 126 , 127 ] 128 """ 129 return HttpResponse(‘Comment‘)
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <style> 7 .comment-box 8 margin-left: 20px; 9 10 </style> 11 </head> 12 <body> 13 <div class="item"> 14 <a news_id="19" class="com">评论</a> 15 <div class="comment-list"> 16 <div class="comment-box"> 17 <span>Py最牛</span> 18 <div></div> 19 </div> 20 <div class="comment-box"> 21 <span>搞基建</span> 22 <div class="comment-box"> 23 <span>小胡比</span> 24 </div> 25 <div class="comment-box"> 26 <span>玩得患</span> 27 </div> 28 </div> 29 </div> 30 </div> 31 <div class="item"> 32 <a news_id="18" class="com">评论</a> 33 </div> 34 <div class="item"> 35 <a news_id="17" class="com">评论</a> 36 </div> 37 38 <script src="/static/jquery-2.1.4.min.js"></script> 39 //JS递归显示评论内容 40 <script> 41 $(function () 42 bindCommentEvent(); 43 ); 44 function bindCommentEvent() 45 $(‘.com‘).click(function () 46 var news_id = $(this).attr(‘news_id‘); 47 var _this = $(this); 48 $.ajax( 49 url: ‘/comment/‘, 50 type: ‘GET‘, 51 data: news_id: news_id, 52 dataType: "html", 53 success:function (arg) 54 //create_tree(arg, _this); 55 console.log(arg); 56 _this.after(arg); 57 58 ) 59 ) 60 61 62 function diGui(children_list) 63 var html = ""; 64 $.each(children_list,function (ck,cv) 65 var b = ‘<div class="comment-box"><span>‘; 66 b+= cv.content + "</span>"; 67 b += diGui(cv.children); 68 b += "</div>"; 69 html += b; 70 ); 71 return html; 72 73 74 function create_tree(data,$this) 75 var html = ‘<div class="comment-list">‘; 76 $.each(data,function (k,v) 77 var a = ‘<div class="comment-box"><span>‘; 78 a+= v.content + "</span>"; 79 // 创建子评论 80 a += diGui(v.children); 81 a+= "</div>"; 82 html += a; 83 ); 84 html += "</div>"; 85 $this.after(html); 86 87 </script> 88 </body> 89 </html>
1 #__author: Administrator 2 #date: 2016/12/26 3 from django import template 4 from django.utils.safestring import mark_safe 5 #simple_tag递归显示评论内容 6 #路径：/app01/templatetags 7 register = template.Library() 8 9 def diGui(children_list): 10 html = "" 11 for cv in children_list: 12 b = ‘<div class="comment-box"><span>‘ 13 b += cv[‘content‘] + "</span>" 14 b += diGui(cv[‘children‘]) 15 b += "</div>" 16 html += b 17 return html 18 19 @register.simple_tag 20 def create_tree(comment_list): 21 html = ‘<div class="comment-list">‘ 22 for v in comment_list: 23 a = ‘<div class="comment-box"><span>‘ 24 a += v[‘content‘] + "</span>" 25 a += diGui(v[‘children‘]) 26 a += "</div>" 27 html += a 28 return mark_safe(html) 29 30 """ 31 function diGui(children_list) 32 var html = ""; 33 $.each(children_list,function (ck,cv) 34 var b = ‘<div class="comment-box"><span>‘; 35 b+= cv.content + "</span>"; 36 b += diGui(cv.children); 37 b += "</div>"; 38 html += b; 39 ); 40 return html; 41 42 43 44 function create_tree(data,$this) 45 var html = ‘<div class="comment-list">‘; 46 $.each(data,function (k,v) 47 var a = ‘<div class="comment-box"><span>‘; 48 a+= v.content + "</span>"; 49 // 创建自评论 50 a += diGui(v.children); 51 a+= "</div>"; 52 html += a; 53 ); 54 55 html += "</div>"; 56 $this.after(html); 57 58 """
% load laogao %
% create_tree comment_tree %//simple_tag递归显示评论内容
以上是关于抽屉实现评论数据结构及评论内容显示示例的主要内容，如果未能解决你的问题，请参考以下文章