vue 实现根据data中的属性值来设置不同的样式


Posted in Javascript onAugust 04, 2020

style动态赋值

vue 实现根据data中的属性值来设置不同的样式

margin-top的值 根据choosePaperFlag的值来设置 利用三元表达式

补充知识:vue 条件判断绑定内联样式

当需要判断条件来绑定内联样式时 可以三元运算符判断,然后绑定一个对象

:style="!areaCode || !phoneNumber || !receivedCode || !verification
? '{backgruond:#ccc}' : $store.state.store.config.background"

以上这篇vue 实现根据data中的属性值来设置不同的样式就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于JQuery的6个Tab选项卡插件
Sep 03 Javascript
jquery.bgiframe.js在IE9下提示INVALID_CHARACTER_ERR错误
Jan 11 Javascript
ExtJS4给Combobox设置列表中的默认值示例
May 02 Javascript
js打开windows上的可执行文件示例
May 27 Javascript
解决bootstrap导航栏navbar在IE8上存在缺陷的方法
Jul 01 Javascript
AngularJS ng-bind 指令简单实现
Jul 30 Javascript
深入研究jQuery图片懒加载 lazyload.js使用方法
Aug 16 jQuery
vue移动端UI框架实现QQ侧边菜单组件
Mar 09 Javascript
Nuxt页面级缓存的实现
Mar 09 Javascript
Laravel 如何在blade文件中使用Vue组件的示例代码
Jun 28 Javascript
JavaScript之scrollTop、scrollHeight、offsetTop、offsetHeight等属性学习笔记
Jul 15 Javascript
在js中修改html body的样式
Nov 11 Javascript
解决Vue中使用keepAlive不缓存问题
Aug 04 #Javascript
vue根据条件不同显示不同按钮的操作
Aug 04 #Javascript
如何在Vue.JS中使用图标组件
Aug 04 #Javascript
如何构建 vue-ssr 项目的方法步骤
Aug 04 #Javascript
vue-quill-editor的使用及个性化定制操作
Aug 04 #Javascript
vue 添加和编辑用同一个表单,el-form表单提交后清空表单数据操作
Aug 03 #Javascript
浅谈vue中get请求解决传输数据是数组格式的问题
Aug 03 #Javascript
You might like
PHP Token(令牌)设计
2008/03/15 PHP
php5中date()得出的时间为什么不是当前时间的解决方法
2008/06/30 PHP
php中大括号作用介绍
2012/03/22 PHP
PHP字符过滤函数去除字符串最后一个逗号(rtrim)
2013/03/26 PHP
Yii中render和renderPartial的区别
2014/09/03 PHP
教你识别简单的免查杀PHP后门
2015/09/13 PHP
Joomla调用系统自带编辑器的实现方法
2016/05/05 PHP
PHP 读取大文件并显示的简单实例(推荐)
2016/08/12 PHP
用CSS+JS实现的进度条效果效果
2007/06/05 Javascript
JavaScript对象创建及继承原理实例解剖
2013/02/28 Javascript
禁止页面刷新让F5快捷键及右键都无效
2014/01/22 Javascript
JavaScript中的Math.LN2属性用法详解
2015/06/12 Javascript
javascript跑马灯抽奖实例讲解
2020/04/17 Javascript
js canvas仿支付宝芝麻信用分仪表盘
2016/11/16 Javascript
vue.js $refs和$emit 父子组件交互的方法
2017/12/20 Javascript
原生JS实现的轮播图功能详解
2018/08/06 Javascript
微信小程序实现收货地址左滑删除
2020/11/18 Javascript
使用nodejs实现JSON文件自动转Excel的工具(推荐)
2020/06/24 NodeJs
vue项目实现减少app.js和vender.js的体积操作
2020/11/12 Javascript
Python Web框架Tornado运行和部署
2020/10/19 Python
Python+Selenium+PIL+Tesseract自动识别验证码进行一键登录
2017/09/20 Python
python3写的简单本地文件上传服务器实例
2018/06/04 Python
Python画图高斯分布的示例
2019/07/10 Python
html5构建触屏网站之touch事件介绍
2013/01/07 HTML / CSS
澳大利亚香水在线商店:City Perfume
2020/09/02 全球购物
Java中实现多态的机制是什么?
2014/12/07 面试题
数控专业大学生的自我鉴定
2013/11/13 职场文书
宿舍违规检讨书
2014/01/12 职场文书
优秀团员个人事迹材料
2014/01/29 职场文书
C++程序员求职信范文
2014/04/14 职场文书
2014年租房协议书范本
2014/10/30 职场文书
会计工作岗位职责
2015/02/03 职场文书
2019职场单身人才调研报告:互联网行业单身比例最高
2019/08/07 职场文书
五年级作文之劳动作文
2019/11/12 职场文书
教你怎么用python爬取爱奇艺热门电影
2021/05/20 Python
MySQL数据库完全卸载的方法
2022/03/03 MySQL