Django项目中实现评论点赞/取消点赞按钮文字切换

现有基于IP的点赞功能逻辑正常，但按钮文字无法根据当前IP的点赞状态动态切换，核心问题是模板未针对每个评论判断用户IP的点赞状态，且视图未传递必要数据。以下是具体修复步骤：

1. 给评论模型添加IP点赞状态判断方法 #

在models.py的Comments类中新增方法，用于检查当前IP是否已点赞该评论：

class Comments(models.Model):
    # 保留原有字段不变
    def is_liked_by_ip(self, ip):
        try:
            ip_obj = IpModel.objects.get(ip=ip)
            return self.likes.filter(id=ip_obj.id).exists()
        except IpModel.DoesNotExist:
            return False

2. 在文章详情视图中传递用户IP到模板 #

修改views.py中ShowPost类的get_context_data方法，获取当前访问用户的IP并加入上下文：

class ShowPost(DataMixin, DetailView, FormMixin):
    # 保留原有代码不变
    def get_context_data(self, *, object_list=None, **kwargs):
        context = super().get_context_data(**kwargs)
        c_def = self.get_user_context(title=context['post'])
        # 获取当前用户IP
        user_ip = get_client_ip(self.request)
        context['user_ip'] = user_ip
        return dict(list(context.items()) + list(c_def.items()))

3. 修改模板动态切换按钮文字 #

更新post.html中的按钮判断逻辑，针对每个评论调用模型方法判断点赞状态：

{% for item in post.comments_women.all %}
<li>
    <p class="total-likes">{{item.total_likes}} likes</p>
    <p class="author-name">{{item.comm_author}}</p>
    <p class="date-com">{{item.create_data}}</p>
    <p class="date-text">{{item.text}}</p>

    <form action="{% url 'blog_like' pk=item.id %}" method="post">
        {% csrf_token %}
        <button type="submit" name="blog-id" value="{{ item.id }}" class="like-btn">
            {% if item.is_liked_by_ip user_ip %}
                取消点赞
            {% else %}
                点赞
            {% endif %}
        </button>
    </form>
    
</li>
{% endfor %}

效果说明 #

• 模型方法is_liked_by_ip负责校验当前IP与评论点赞记录的关联关系
• 视图传递用户IP后，模板可针对每个评论动态生成对应状态的按钮文字
• 点击点赞/取消点赞后页面刷新，按钮文字会自动同步当前IP的点赞状态

内容的提问来源于stack exchange，提问作者Богдан Фещенко