Vue.js(2.x)之Class 与 Style 绑定

1、前面看数据绑定时还很困惑v-bind处理class时可以使用json格式的值,为什么换成id、href等其他属性就不行。看了下文档解释后明白了些:

 

2.对象语法主要有以下三种形式:

1)直接在v-bind指令后使用键值对形式:键是否显示为class取决于值是否为真,须留意键是否要加引号(如果键有特殊符号)。

  

 

2)直接绑定数据里的一个对象,并设定其为v-bind指令后的值。

3)绑定对象的计算属性并设定其为v-bind指令后面的值。

 

3.数组语法:下图中只有少数几个class,当然一般元素的class也尽量3个以内,不排除偶尔有多个的情况,这时可以对象与数组结合,即数组里的某个值可以为对象。

组件还不熟,暂且不表。

 

4.“其实它是一个JavaScript对象”到底是啥,偶这种半吊子好奇心被吊了起来,查半天没找到个所以然。

如果style属性中带有中划线-,例如:font-sizebackground-color、background-img等时,必须用驼峰写法或者是引号引起来,否则在渲染时可能不识别就会出错!

 

“自动添加前缀”与“多重值”这两个体会不深,也没有很好的实例运用。希望后面有所体会时再加以阐述。

 

转载于:https://www.cnblogs.com/anns/p/7395941.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/268633.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

linux 下yy命令,Linux 基本命令(一)--时间 常用命令

2019-07-30date 系统时间参数显示时间是个常用的命令,在写shell脚本中也经常会用到与日期相关文件名或时间显示。无论是linux还是windows下都是date命令。Linux下date命令用法date [OPTION]… [FORMAT]date [-u|--utc|--universal] [MMDDhhmm[[CC]YY][.ss]]date命令…

linux 内核高拍仪,高拍仪开发控件 | Dynamsoft Camera SDK

基于浏览器的摄像头、高拍仪控件Dynamsoft Camera SDK 提供了 JavaScript API,帮助您在浏览器里轻松地从 USB(USB Video Class,即 UVC) 视频捕获设备,如摄像头、高拍仪, 捕捉图像和视频流。使用 Dynamsoft Camera SDK 这个基于 Web 的开发控件&#xff0…

MySQL优化大总结

1.要尽量避免全表扫描,首先应考虑在 where 及 order by 涉及的列上建立索引。 2.应尽量避免在 where 子句中对字段进行 null 值判断,否则将导致引擎放弃使用索引而进行全表扫描,如: select id from t where num is null 最好不要给…

BigDecimal四舍五入后保留两位小数

BigDecimal bd new BigDecimal("8.899");BigDecimal bigDecimal bd.setScale(2, BigDecimal.ROUND_HALF_UP);

25 个在 Web 中嵌入图表的免费资源

来源:blogof.francescomugnai.com在 Web 中嵌入图形图表的技术越来越丰富,我们可以选择 JavaScript 库,CSS,Flash,Silverlight,PHP 库,服务器端的组件,也可以选择 Google Chart API 这样的 Web …

linux的sed命令是什么,linux sed命令

linux sed命令简介:sed是一种流编辑器,它一次处理一行内容。处理时,把当前处理的行存储在临时缓冲区中,称为“模式空间”(patternspace),接着用sed命令处理缓冲区中的内容,处理完成后,把缓冲区的…

以太坊智能合约开发环境配置

转载于:https://www.cnblogs.com/preminem/p/7403669.html

Cisco ××× 完全配置指南-连载-SSL ×××

Cisco 完全配置指南-连载-SSL 详细内容见附件转载于:https://blog.51cto.com/xuanbo/149721

012.Adding a New Field --【添加一个新字段】

索引: 目录索引 Adding a New Field 添加一个新字段 2016-10-14 3 分钟阅读时长 作者 By Rick Anderson In this section youll use Entity Framework Code First Migrations to add a new field to the model and migrate that change to the database. 在本节,我…

system.gc()和system.runFinalization()区别作用

system.gc()和system.runFinalization()区别作用: System.gc(); //告诉垃圾收集器打算进行垃圾收集,而垃圾收集器进不进行收集是不确定的 System.runFinalization(); //强制调用已经失去引用的对象的finalize方法

Linux中xml导入数据库,XML数据库 BaseX

BaseX 是一个XML数据库,用来存储紧缩的XML数据,提供了高效的 XPath 和 XQuery 的实现,还包括一个前端操作界面。BaseX是一个非常轻巧和高性能的XML数据库系统和XPath/XQuery处理。包含了对W3C Update和Full Text扩展的全面支持。一个可交互和…

redhat Enterprise 5下安装中文输入法,

redhat Enterprise 5下安装中文输入法,这实际上次解决VMware 6.5下不能正确显示中文的第二部分吧,还是以前的老问题,VMware6.5下安装redhat Enterprise linux5 过程中完全是自动安装,没有选项,装完之后是中文版&#x…

linux教程opensuse,OpenSUSE/Linux 网络配置

因工作需要,接触到了一台OpenSUSE系统的Linu服务器,开始以为和CentOS一样只需要配置一个ifcfg-ethx文件即可,但是配置后却发现根本没有网络,遂去查询相关资料,OpenSUSE系统的网络设置如下:一、修改ifcfg-et…

C++学习点滴

最近加入一个C的学习群,群里免不了有些网友提问题。我也正好学习一下。把一些问题,一些小程序记录下来,让自己的C水平慢慢提上来...... 函数功能: 把输入的字符串中的标点符号去掉之后输出来,循环执行 如果输入的字符串…

Flume协作框架

Flume协作框架 1.概述   -》flume的三大功能    collecting, aggregating, and moving       收集 聚合 移动 2.框图 3.架构特点  -》on streaming data flows    基于流式的数据    数据流:job-》不断获取数据    任务流:job…