今天要做一个对文章点赞的功能，实现后的样式如下，点赞后的文章下面的大拇指图标会变红，并且点赞数加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. RxJava--Buffer,GroupBy 对比

    Buffer 设定收集n个元素为一组,以下方代码为例,三个为一组,则当组满三个元素时,返回一次List数据 没组满三个元素时,如果调用onComplete,直接发送剩余元素,没调用onComplete ...

  2. swift 3.0字符串的简单使用

    let str:String = "12314124" 获取某个指定位置的元素 print(str.characters[str.index(str.startIndex, off ...

  3. CS Requirements and Resources

    有感于国内令人发指的CS教育,决定以自学为主. 路线会按照计算机科学与技术的技能树,主要学习四大的比较完整的课程,video没时间看,但reading会仔细看.lab会认真做,对于一些比较有意义.代码 ...

  4. P3842 [TJOI2007]线段

    最近多刷些dp,觉得这个算不上蓝题   在一个\(n\times n\)的平面上,在每一行中有一条线段,第\(i\)行的线段的左端点是\((i, L_i)\),右端点是\((i, R_i)\),其中\ ...

  5. oracle常用数学函数

    数学函数 ABS:(返回绝对值) --返回绝对值 select abs(-1.11) from dual; CEIL:(向上取整) --向上取整 select ceil(3.1415) from du ...

  6. Spring官网阅读（十三）ApplicationContext详解（下）

    文章目录 BeanFactory 接口定义 继承关系 接口功能 1.HierarchicalBeanFactory 2.ListableBeanFactory 3.AutowireCapableBea ...

  7. mysql中的读锁和写锁

    当mysql为一个表开启读锁的时候,其他进程包括进程本身没有权利去修改这张表的内容,也没有权利更新,但是可以读取表里面的内容 如下例子 给表上读锁 接着更新一下,显示被锁了 释放锁并插入数据 写锁 查 ...

  8. matlab 调用C程序进行simulink仿真

    文章目录 simulink仿真 创建C程序 编译C程序 运行结果 simulink仿真 simulink仿真中需要使用S-Function模块,可以实现调用C程序进行仿真,下面先建立一个简单的仿真: ...

  9. 图形学_opengl纹理映射

    学了半学期的图形学,除了几个用python或是matlab比较方便的实验外,用的大多数是opengl,在这总结一下纹理贴图实验中opengl的用法. 1.编译器连接静态库 有用到glaux.h的程序, ...

  10. 3-JVM垃圾回收算法和垃圾收集器

    垃圾回收算法和垃圾收集器 1.什么是垃圾回收 对于内存当中无用的对象进行回收,如何去判断一个对象是不是无用的对象. 引用计数法: 每个对象中都会存储一个引用计数,每增加一个引用就+1,消失一个引用就- ...