1、最终显示样式:

需要:根据任务状态值,显示不同颜色的原点表示任务状态,以及对优先级的数据,进行☆标记

2、代码实现:

  在<el-table-column>中需要显示的内容前面,添加图标元素,并添加对应的class样式。

  其中,addclassStatus以及addclassPriority两个方法是自己定义的计算,根据属性值计算class样式的方法

3、在vue中的 export default 中的methods中进addclassStatus以及addclassPriority方法的计算和赋值

4、在css文件中定义css样式

vue如何根据返回的值对元素进行样式渲染的更多相关文章

  1. vue修改对象的属性值后页面不重新渲染

    原文地址:vue修改对象的属性值后页面不重新渲染 最近项目在使用vue,遇到几次修改了对象的属性后,页面并不重新渲染,场景如下: HTML页面如下: [html] view plain copy &l ...

  2. 返回数组中指定的一列,将键值作为元素键名array_column

    array_column() 函数 从记录集中取出 last_name 列: <?php // 表示由数据库返回的可能记录集的数组 $a = array( array( 'id' => 5 ...

  3. [C++]返回最值元素

    1 priority_queue C++中优先队列是一种特殊的队列,能够返回队列中优先级最大或者最小的元素,其内部是由堆实现的,个人认为这种方式使用更加直观. 1.1 返回vector中的最值元素 # ...

  4. 使用size()方法输出列表中的元素数量。需要注意的是,这个方法返回的值可能不是真实的,尤其当有线程在添加数据或者移除数据时,这个方法需要遍历整个列表来计算元素数量,而遍历过的数据可能已经改变。仅当没有任何线程修改列表时,才能保证返回的结果是准确的。

    使用size()方法输出列表中的元素数量.需要注意的是,这个方法返回的值可能不是真实的,尤其当有线程在添加数据或者移除数据时,这个方法需要遍历整个列表来计算元素数量,而遍历过的数据可能已经改变.仅当没 ...

  5. vue 简单实现父组件向子组件传值,简单来说就是子组件肆意妄为的调用父组件里后台返回的值

    首先在于父子组件传值的方法很多,本人在这里只是简单描述一下一个组件里面引用了子组件,那么子组件如何才能获取父组件中后台返回的值呢? 首先调用组件相信大家都应该明白了(不明白的自己撸撸文档), < ...

  6. malloc error:初始值设定元素不是常量

    #include <stdio.h> #include <stdlib.h> char *buf = (char *)malloc(BUFSIZ); setbuf(stdout ...

  7. Vue.js-04:第四章 - 页面元素样式的设定

    一.前言 前端开发中有三大件:HTML.CSS.JavaScript,在前面的学习中,不管是学习 Vue 的指令系统还是 Vue 的事件修饰符,主要还是针对的是我们在前端开发中的 JavaScript ...

  8. SQL server 查询出现:---“子查询返回的值不止一个。当子查询跟随在 =、!=、<、<=、>、>= 之后,或子查询用作表达式时,这种情况是不允许的。”SQL查询错误解析---

    最近用select进行数据筛选,碰到下面的这个错误: ---子查询返回的值不止一个.当子查询跟随在 =.!=.<.<=.>.>= 之后,或子查询用作表达式时,这种情况是不允许的 ...

  9. 实现一个优先级队列,每次pop 返回优先级最高的元素

    demo1 实现一个按优先级排序的队列, 并且在这个队列上面每次 pop 操作总是返回优先级最高的那个元素 import heapq class PriorityQueue: def __init__ ...

随机推荐

  1. JS三角形

    1.直角三角形 <script> ; ; i++) { //外层循环代表的是要循环的行数 ; j < i; j++) { //内层循环代表的是要打印的列数 document.writ ...

  2. 关系数据库标准语言SQL

    篇幅过长,恐惧者慎入!!!基础知识,大神请绕道!!! 本节要点: l  SQL概述 l  学生-课程关系 l  数据定义 基本表的定义.删除与修改 索引的建立与删除 l  查询 单表查询 连接查询 嵌 ...

  3. CF802G Fake News (easy)

    CF802G Fake News (easy) 题意翻译 给定一个字符串询问能否听过删除一些字母使其变为“heidi” 如果可以输出“YES”,不然为“NO” 题目描述 As it's the fir ...

  4. iis配置问题报错 -- Could not load file or assembly 'Oracle.DataAccess' or one of its dependencies

    具体提示: Could not load file or assembly 'Oracle.DataAccess' or one of its dependencies. 试图加载格式不正确的程序. ...

  5. 给 string 添加一个 GetInputStream 扩展方法

    有时候,我们须要读取一些数据,而无论这数据来源于磁盘上的数据文件,还是来源于网络上的数据.于是.就有了以下的 StringExtensions.cs: using System; using Syst ...

  6. 【iOS开发-78】用代码实现UITabBarController+UINavigationController

    watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvd2Vpc3ViYW8=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA ...

  7. Codeforces Round #FF (Div. 2):B. DZY Loves Strings

    B. DZY Loves Strings time limit per test 1 second memory limit per test 256 megabytes input standard ...

  8. 王立平--poser

    Poser是Metacreations公司推出的一款lemmaId=234814&ss_c=ssc.citiao.link" style="color:rgb(51,102 ...

  9. 转:Oracle GoldenGate学习之Goldengate介绍

    转自:http://blog.sina.com.cn/s/blog_a32eff28010136d9.html 日志或归档日志获得数据的增删改变化,再将这些变化应用到目标数据库,实现源数据库与目标数据 ...

  10. Redis学习笔记(十二) 高级命令:服务器管理命令

    原文链接:http://doc.redisfans.com/server/index.html save 执行一个同步操作,将redis实例的所有数据以rdb的形式保存到硬盘,一般来说,生产环境很少执 ...