Django点赞的实现示例

目录 1.前期准备 2.html实现 3.js实现【！！！注意这段代码写在for循环之内】 4.css实现

1.前期准备

用户models.py

class User(models.Model):
? ? username = models.CharField("用户名",max_length=10)

点赞models.py
LikeNum的作用在于当有人点赞时可以把它记录下来，包括点赞者和点赞的内容

# 喜欢数
class LikeNum(models.Model):
? ? user = models.ForeignKey(UserInfos,null=True,on_delete=models.SET_NULL)
? ? discussion = models.ForeignKey(Discussion,null=True,on_delete=models.SET_NULL)
? ? class Meta:
? ? ? ? verbose_name_plural = 'user'

发布models.py
Discusssion的作用在于渲染前端页面，里边包括动态发布人和被点赞数量

# 我的讨论
class Discussion(models.Model):
? ? user = models.ForeignKey(UserInfos,null=True,on_delete=models.SET_NULL)
? ? likes = models.PositiveIntegerField("喜欢",default=0,editable=False)
? ? class Meta:
? ? ? ? verbose_name_plural = 'Discussion'

views.py

# 讨论点赞
def addLikes(request,id):
?? ?# 识别出该登陆者用户信息
? ? if request.session.get('username') and request.session.get('uid'):
? ? ? ? username = request.session.get('username')
? ? ? ? user = UserInfos.objects.get(username=username)
? ? else:
? ? ?? ?# error 是自己写的出错页面
? ? ?? ?return HttpResponseRedirect('/error')
? ? ?? ?
? ? # 判别点赞的该Discussion是否存在，有可能在你点赞的时候该用户已经删除，注意不能简单的使用if，else当找不到discussion时会出错
? ? try:
? ? ? ? if Discussion.objects.get(id=id):
? ? ? ? ?? ?# 如果Discussion存在
? ? ? ? ? ? d = Discussion.objects.get(id=id)
? ? ? ? ? ? # 如果User存在
? ? ? ? ? ? if user:
? ? ? ? ? ? ?? ?# 判断当前用户是否已经给该Discussion点过赞
? ? ? ? ? ? ?? ?# record 为该记录，不存在时则自动创建
? ? ? ? ? ? ?? ?# flag 为当前是否操作
? ? ? ? ? ? ? ? record,flag = LikeNum.objects.get_or_create(user=user,discussion=d)
? ? ? ? ? ? ? ? # 如果刚刚创建
? ? ? ? ? ? ? ? if flag:
? ? ? ? ? ? ? ? ? ? d.likes+=1
? ? ? ? ? ? ? ? ? ? d.save()
? ? ? ? ? ? ? ? # 如果没操作，说明之前点过赞，此时再次点赞说明是要取消点赞
? ? ? ? ? ? ? ? else:
? ? ? ? ? ? ? ? ? ? d.likes -= 1
? ? ? ? ? ? ? ? ? ? d.save()
?? ??? ??? ??? ? ? ?# 并且删除掉点赞记录
?? ??? ? ? ? ? ? ? ?LikeNum.objects.get(user=user,discussion=d).delete()
?? ??? ? ? ? ? ?# 跳转到发布页面
? ? ? ? ? ? ? ? return render(request,'page.html',{'page':Discusssion.objects.all(),'ln':LikeNum.objects.fitter(user=user)})
? ? ? ? ? ? else:
? ? ? ? ? ? ?? ?# 如果session中没有用户信息，则跳转到登陆页面
? ? ? ? ? ? ? ? return redirect('/login') ?
? ? except Exception as e:
? ? ? ? # 否则跳转到失败页面
? ? ? ? return HttpResponseRedirect('/error')

2.html实现

{% for item in page %}
<div>
?? ?用户名:{{item.user.username}}
? <a id="id{{item.id}}">
? ? ? ?<svg class="icon" aria-hidden="true">
? ? ? ? ? ? ? ?<use xlink:href="#icon-like-fill" rel="external nofollow" ></use>
? ? ? ? ? ?</svg>
? ? ? ?<span id="nlikes">{{item.likes}}</span>
? ?</a>
</div>
<!-- 请把我写在这里 3.js实现 --!>
{% endfor %}

3.js实现【！！！注意这段代码写在for循环之内】

//ln指likenum【点赞数】,因为点赞记录是QuerySet，需要从里边遍历
?{% if ln %}?
?// 遍历
?{% for l in ln %}?
?// 当当前的discussion在LikeNum记录里时，为a标签添加一个class
?{% if l.discussion == item %}
?? ?<script>
?? ? ? ?obj = document.getElementById('id{{item.id}}');
?? ? ? ?obj.className = 'success';
?? ?</script>
{% endif %}?
{%endfor%}?
{%endif%}

4.css实现

.success {
? ? color: #fc5531;
? ? text-decoration: none;
}

a {
? ? text-decoration: none;
? ? color: #848B96;
}

a:hover {
? ? color: #fc5531;
}

这只是一个大概流程，具体的美化还需要自己实现，不懂得话可以留言来交流！

示意图【我自己做出来的效果】

 到此这篇关于Django点赞的实现示例的文章就介绍到这了,更多相关Django 点赞内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持！

查看更多关于Django点赞的实现示例的详细内容...