本文为博主原创,未经允许不得转载:

一 原生用法

style="width: 100%; margin-top: 20px" disabled

二  三元表达式

<a :style="{color:(index==0?arr.conFontColor:'#000')}" :href="con.subTitleHref" target="_self">{{con.subTitle}}</a>

或者:

<Button  type="text" size="small" @click="showEdit(row)" :style="row.status==0?'color:#2d8cf0':''" :disabled="row.status==1">修改</Button>

三 函数用法

 <div :style="{ height: tableRowHeight(item) }" class="tableRowCox">
{{ item.id ? item.id : "--" }}
</div>

四 变量用法

<div :style="{ height:conFontHeight}"> {{ item.id ? item.id : "--" }} </div>

vue 中对style、disable 等样式进行条件判断的更多相关文章

  1. vue中滚动页面,改变样式&&导航栏滚动时,样式透明度修改

    vue中滚动页面,改变样式&&导航栏滚动时,样式透明度修改.vue <div class="commonHeader" v-bind:class=" ...

  2. vue中修改第三方组件的样式不生效

    问题 在使用element-ui时,有时候想要修改组件内的样式,但不成功,例如 <div class="test"> <el-button>按钮</e ...

  3. VUE中的style 样式处理的Scope (<style scope>)

    在VUE组件中,为了让样式私有化,不对全局造成污染,可以在style标签上添加scoped属性以表示它的只属于当下的模块. 但是这样的话,就会导致无法修改其他第三方组件样式,或者是内嵌的样式,解决方案 ...

  4. vue 中使用style(样式)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 【转】vue中样式被覆盖的问题,vue中的style不生效

    转载:http://www.cnblogs.com/shangjun6/p/11416054.html 在我们引入外部的样式时,发现自己无论如何都改不了外部的样式,自己的样式老被覆盖,究其原因还是我们 ...

  6. vue中修改第三方组件的样式并不造成污染

    vue引用了第三方组件, 需要在组件中局部修改第三方组件的样式, 而又不想去除scoped属性造成组件之间的样式污染. 此时只能通过>>>,穿透scoped. 但是,在sass中存在 ...

  7. 手写vue中v-bind:style效果的自定义指令

    自定义指令 什么是自定义指令 以 v- 为前缀,然后加上自己定义好的名字组成的一个指令就是自定义指令.为什么要有自定义指令呢?在有些时候,你仍然需要对普通的DOM元素进行底层的操作,这个时候就可以用到 ...

  8. vue单文件 style important引入样式

    使用@import引入外部css,作用域是全局的 <template> </template> <script> export default { name: &q ...

  9. vue中设置全局的css样式

    只需在main.js    ====import './style.less'   main.js =>>   import Vue from 'vue' import App from ...

  10. vue中通过js控制页面样式方法

    在使用vue.js框架的时候,有时候会希望在页面渲染完成之后,再执行函数方法来处理初始化相关的操作,如果只处理页面位置.宽或者高时,必须要在页面完全渲染之后才可以,页面没有加载完成之前,获取到的宽高不 ...

随机推荐

  1. 最好用的AI换脸软件,rope下载介绍

    随着AI技术的广泛运用,市面上的换脸软件也多了起来,今天给各位介绍其中的王者Rope! 先上两个动图,给大伙看看效果 rope是如何实现这种自然的效果呢?这得益于机器学习技术的不断发展,rope经过深 ...

  2. 记一次 .NET 某药厂业务系统 CPU爆高分析

    一:背景 1. 讲故事 前段时间有位朋友找到我,说他们的程序出现了CPU爆高,让我帮忙看下怎么回事?这种问题好的办法就是抓个dump丢给我,推荐的工具就是用 procdump 自动化抓捕. 二:Win ...

  3. flask应用程序配置

    flask中配置app的配置有几种方式,不同的场景适合用不同的方式. 配置定义方式如下:(注意:这几种方式都时可以混用的) 直接调用app.config来设置. app.config["SE ...

  4. MinIO客户端之rb

    MinIO提供了一个命令行程序mc用于协助用户完成日常的维护.管理类工作. 官方资料 mc rb 彻底删除指定的桶. 命令如下: ./mc rb local1/bkt1 控制台的输出,如下: mc: ...

  5. Next.js 开发指南 初始篇 | Next.js CLI

    基础篇.实战篇.源码篇.面试篇四大篇章带你系统掌握 Next.js!   前言 欢迎学习 Next.js!在学习具体的知识点之前,我们先来创建一个 Next.js 项目.创建了可运行的项目,才能在学习 ...

  6. BUUCTF Reverse 新年快乐

    下载文件先查壳,可以看到有UPX壳 用upx脱壳 拖到ida pro32,shift+F12查看字符串,看到关键字flag,双击进去 双击然后f5查看伪代码 main函数伪代码 关键函数: strnc ...

  7. C语言汉诺塔递归算法实现

    这是个目录 一.什么是递归函数 1.先看一下一个递归的例子 2.递归的基本原理 二.汉诺塔问题 1.简要概括一下汉诺塔的故事 2.回到编程,汉诺塔问题主要就是解决这个问题: 3.怎么解决汉诺塔问题 要 ...

  8. Centos7 Zabbix3.2安装(yum)

    http://repo.zabbix.com/zabbix/3.2/rhel/7/x86_64/  #官网下载地址(只包含zabbix的应用包) ftp://47.104.78.123/zabbix/ ...

  9. st_geometry、st_transform配置及问题汇总

    1.文件配置修改 路径上一定要使用双斜杠 2.使用sde账号登录,执行以下SQL,路径按照实际环境填写. select * from user_libraries; create or replace ...

  10. Java 中时间对象的序列化

    在 Java 应用程序中,时间对象是使用地比较频繁的对象,比如,记录某一条数据的修改时间,用户的登录时间等应用场景.在传统的 Java 编程中,大部分的程序员都会选择使用 java.uti.Date ...