1. <div class="collect" @click="collected=!collected">
  2.   <i class="fa fa-heart" :style="{'color': collected ?'rgb(240, 20, 20)':'rgb(147, 153, 159)'}"></i>
  3.   <span class="text" :style="{'color': collected ?'rgb(77, 85, 93)':'rgb(147, 153, 159)'}">{{collected?'已收藏':'收藏'}}</span> 
    </div>

vue之v-bind:style的更多相关文章

  1. vue 内联样式style中的background

    在我们使用vue开发的时候   有很多时候我们需要用到背景图 这个时候会直接使用 内联样式 直接把你拿到的数据拼接上去 注意  在vue中直接使用style时 花括号一定别忘记 还有就是你的url一定 ...

  2. v - bind

    1. 用于处理html标签的动态属性,即动态赋值(动态地绑定一个或多个特性,或一个组件 prop 到表达式) 2. 官网API <!DOCTYPE html> <html lang= ...

  3. Vue中class与style绑定

    gitHub地址:https://github.com/lily1010/vue_learn/tree/master/lesson07 一 用对象的方法绑定class 很简单,举个栗子: <!D ...

  4. 前端框架之Vue(4)-Class与Style绑定

    操作元素的 class 列表和内联样式是数据绑定的一个常见需求.因为它们都是属性,所以我们可以用 v-bind 处理它们:只需要通过表达式计算出字符串结果即可.不过,字符串拼接麻烦且易错.因此,在将  ...

  5. Vue入门---属性、style和class绑定方法

    一 .用对象的方法绑定class <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...

  6. vue基础——Class与Style绑定

    Class与Style绑定 操作元素的class列表和内联样式是数据绑定的一个常见的需求. 因为它们都是属性,所以我们可以用v-bind来处理它们:只需要通过表达式计算出字符串结果即可.不过,字符串拼 ...

  7. vue - 绑定css、style

    1.绑定html css1.1对象语法: 传给 v-bind:class 一个对象,以动态地切换 class <div v-bind:class="{ active: isActive ...

  8. vue基础---Class 与 Style 绑定

    [一]绑定HTML Class (1)对象语法 ①普通绑定class <div id="area" v-bind:class="className"> ...

  9. VUE：class与style强制绑定

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  10. vue 多种方式控制style属性

    一共用到了两种方式: 第一种:对象 第二种:数组 看代码: <!doctype html> <html lang="en"> <head> &l ...

随机推荐

  1. html5学习整理-0311

    整理一下今天所学的一些标签内容. 首先说一下DNS:全称Domain Name System,域名系统.是因特网上作为域名和IP地址相互映射的一个分布式数据库. URL协议:规定URL地址的格式,UR ...

  2. Ural 1260 A nudnik photographer（DP）

    A nudnik photographer 大意: 对1到N这些数进行排列,1必需要在最左边.相邻的两个数之间的差值不能超过2,问有多少种排列的方法. 思路: 对座位进行DP,当第一个是1,第二个是2 ...

  3. Django——WEB三层架构与MVC

    而我发此文的目的有二:一者,让初学者能够听到一家之言,是为解惑:二者,更希望抛砖引玉,得到专家的批判. 许多学生经常问我,MVC到底和WEB三层架构有啥关系? 开始时,我也只能给他们一些模糊的回答.时 ...

  4. C语言-求最大值

    #include<stdio.h> void main() {int a,b,c,d; scanf("%d,%d,%d",&a,&b,&c); ...

  5. 解决C#使用Microsoft.Office.Interop.Excel操作Excel后进程一直存在的问题

    This resolved the issue for me. Your code becomes: public Excel.Application excelApp = new Excel.App ...

  6. mui 上拉加载更多

    看起来很简单的东西,实践过程中还是出现了很多麻烦,比如上拉时,状态条跑到了顶部,因为内容没有添加到容器中,再比如下拉的回调函数使用问题,this的传递. html实现部分: <div class ...

  7. 初识 Java

    1.Java中的数据类型 Java 语言是一种强类型语言.通俗点说就是,在 Java 中存储的数据都是有类型的,而且必须在编译时就确定其类型. Java 中有两类数据类型: 在 Java 的领域里,基 ...

  8. WireShake的使用

    转自点击打开链接 之前写过一篇博客:用 Fiddler 来调试HTTP,HTTPS. 这篇文章介绍另一个好用的抓包工具wireshark, 用来获取网络数据封包,包括http,TCP,UDP,等网络协 ...

  9. mysql 5.6的安装

    MySQL安装   yum install -y perl-Module-Install.noarch cd /usr/local/src wget http://mirrors.sohu.com/m ...

  10. WORD文档书签管理

    最近在浏览一个word超长文档,在文档中有几处要点用颜色做了标记,但是在下次查找的时候无法定位,还得一页页去翻,而且无法通过目录概览的形式查看总共做了多少处标记 于是想到了书签 原本以为在视图中能够设 ...