今天要做一个对文章点赞的功能,实现后的样式如下,点赞后的文章下面的大拇指图标会变红,并且点赞数加1

一开始分别遇到过两个问题:
1、点文章中的一个赞,所有文章的赞全部变红了

2、点赞后,虽然当前文章的赞变红了,但是其他赞过的文章样式没有保持变红的状态

上面两个问题都是共用一个布尔或整数变量导致的。

为了避免点赞时不影响其他文章的点赞样式,需要定义一个数组变量来存放点过赞的文章id,流程如下

贴上代码:

vue实现对文章列表的点赞的更多相关文章

  1. 浅入深出Vue:文章列表

    终于到我们小项目的最后一个功能了,那就是列表页展示! 新建组件 先来新建组件 List.vue: <template> <div></div> </templ ...

  2. 用weexplus从0到1写一个app(2)-页面跳转和文章列表及文章详情的编写

    说明 结束连续几天的加班,最近的项目终于告一段落,今天抽点时间开始继续写我这篇拖了很久的<用weexplus从0到1写一个app>系列文章.写这篇文章的时候,weexplus的作者已经把w ...

  3. BBS论坛 文章详情、点赞、评论

    六.文章详情.点赞.评论 文章详情页面: def article_detail(request, username, article_id): # user_obj = models.UserInfo ...

  4. 第 3 篇:实现博客首页文章列表 API

    作者:HelloGitHub-追梦人物 文中所涉及的示例代码,已同步更新到 HelloGitHub-Team 仓库 此前在讨论基于模板引擎的开发方式和 django-rest-framework 开发 ...

  5. Laravel大型项目系列教程(四)显示文章列表和用户修改文章

    小编心语:不知不觉已经第四部分了,非常感谢很多人给小编提的意见,改了很多bug,希望以后能继续帮小编找找茬~小编也不希望误导大家~这一节,主要讲的 是如何显示文章列表和让用户修改文章,小编预告一下(一 ...

  6. ASP.NET MVC5 网站开发实践(二) Member区域 - 全部文章列表

    显示文章列表分两块,管理员可以显示全部文章列表,一般用户只显示自己的文章列表.文章列表的显示采用easyui-datagrid.后台需要与之对应的action返回json类型数据   目录 ASP.N ...

  7. Whatbeg's blog 文章列表

    whatbeg.com 文章列表 ----------------------------------------------------------------------------------- ...

  8. Cocostudio 文章列表

    Cocostudio 文章列表 Cocostudio(1) 容器层的使用- ScrollView ListView PageViewhttp://www.cnblogs.com/TS-qrt/arti ...

  9. C++ 文章列表

    C++ 文章列表 Cocos2dx(1) iconv 跨平台的使用方法(Android, IOS) --- 转码(中文乱码)http://www.cnblogs.com/TS-qrt/articles ...

随机推荐

  1. 2020.2.27——STL初步

    注:本文主要针对STL中的常用的操作进行总结 目录: 1.swap 2.sort 3.reverse 4.min,max(比较简单,暂且略过) 5._gcd 6.lower_bound &&a ...

  2. 多重背包转化成完全背包 E - Charlie's Change

    http://poj.org/problem?id=1787 这个题目我一看就觉得是一个多重背包,但是呢,我不知道怎么输出路径,所以无可奈何,我就只能看一下题解了. 看了题解发现居然是把多重背包转化成 ...

  3. 惠普服务器ipmi配置方法

    个人感觉惠普ipmi搞的比戴尔的好 惠普的ipmi口在服务器上的端口名称叫ilo 1.开机按F8进入ilo. 注:按晚了,会进入磁盘阵列配置页面,开机画面显示出来ilo相关的信息之后就要按F8. 2. ...

  4. NEON中的vshr vshl vext中的位移参数必须为编译时字面常量

    NEON中的vshr指令中位移数量参数必须为compile time literal constant,因为该参数是被encoded as part pf ARM instruction itself ...

  5. band-pass filtering

    from scipy import signal # 带通滤波器 # 信号,频率下限,频率上限, 采样率 def bandPass(signals, fre_low, fre_high, fs): b ...

  6. 【Spark】RDD(Resilient Distributed Dataset)究竟是什么?

    目录 基本概念 官方文档 概述 含义 RDD出现的原因 五大属性 以单词统计为例,一张图熟悉RDD当中的五大属性 解构图 RDD弹性 RDD特点 分区 只读 依赖 缓存 checkpoint 基本概念 ...

  7. 解决编码问题:AttributeError: 'str' object has no attribute 'decode'

    1. 问题发现: 出现:读取文件,对其进行解码,出现错误,AttributeError: 'str' object has no attribute 'decode' 解释:属性错误,str对象不包含 ...

  8. 一篇博客带你轻松应对Springboot面试

    1. SpringBoot简介 SpringBoot是简化Spring应用开发的一个框架.他整合了Spring的技术栈,提供各种标准化的默认配置.使得我们可以快速开发Spring项目,免掉xml配置的 ...

  9. 对文本的内容进行排序(io流、集合操作)

    package com.itheima.demo01.BufferedStream; import java.io.*; import java.util.HashMap; /* 练习: 对文本的内容 ...

  10. [codeforces525D]BFS

    题目大意: 给定一个包含'.'和'*'的地图,每次操作可以把'*'->'.',用最少的操作使得新图满足条件:所有的连通块为矩形('.'为可达点) 解法: 用bfs来模拟操作的过程,对于一个2*2 ...