Vue:替换/合并现有的特性
假设这是 bs-date-input
的模板:
<input type="date" class="form-control"> |
为了给该日期选择器插件增加一个特殊的主题,我们可能需要增加一个特殊的 class,比如:
<bs-date-input |
在这个例子当中,我们定义了两个不同的 class
值:
form-control
,来自组件自身的模板date-picker-theme-dark
,来自父组件
对于多数特性来说,传递给组件的值会覆盖组件本身设定的值。即例如传递 type="large"
将会覆盖 type="date"
且有可能破坏该组件!所幸我们对待 class
和 style
特性会更聪明一些,这两个特性的值都会做合并 (merge) 操作,让最终生成的值为:form-control date-picker-theme-dark
。
总结:就是vue可以将两个class合并在一起,这样就解决了两个class会覆盖掉一个的问题
Vue:替换/合并现有的特性的更多相关文章
- Vue.js 3.0 新特性预览
总结起来,Vue 3 以下方面值得我们期待 : 更快 更小 更易于维护 更多的原生支持 更易于开发使用 完整的PPT:docs.google.com/presentatio… Evan 和 Vue 团 ...
- vue 动态合并单元格、并添加小计合计功能
1.效果图 2.后台返回数据格式(平铺式) 3.后台返回数据后,整理所需要展示的属性存储到(items)数组内 var obj = { "id": curItems[i].id, ...
- Vue插槽的另外一些特性
之前有个项目,想判断一下,某一个模板内的插槽是否被使用. 不知道是不是问题过于简单,网上没有这方面的说明.我就抽时间验证一下vue插槽相关的一些功能. 然后写下这篇随笔,希望对后来人能有一些帮助. 简 ...
- vue的provide和inject特性
由来 组件之间的通信可以通过props和$emit的方式进行通信,但是如果组件之间的关系非常复杂的话,通过以上的方式会很麻烦,并且程序会非常脆弱,没有建中性可言. 在==vue2.2.0 中新增pro ...
- vue表格合并行的一个实例
一.element控件实现 在平常的应用中,需要用到合并单元格的操作,在Excel中,这种操作很好实现,但在实际项目中,常常需要借助element控件来实现. 下面是element中的一个实例 ...
- 【vue】组件使用Deferred特性
延迟加载组件 defer的意思是"延迟",所以deferred对象的含义就是"延迟"到未来某个点再执行. <template> <div> ...
- vue学习之组件(component)(一)
组件 (Component) 是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素,Vue.js 的编译器为它添加特殊功能.在有些情况下, ...
- vue組件自学
Vue组件 什么是组件? 组件 (Component) 是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素,Vue.js 的编译器为它添 ...
- vue2.x阅读笔记
v-once 作用: 只赋值一次 注意: 包括子项都是只赋值一次 模板 1.v-text v-html 2.{}语法 3.如果是html的属性,则用v-bind绑定,简写: 注意: 1.可以使用jav ...
随机推荐
- OC+RAC(六) 核心方法bind
-(void)_test6{ RACSignal *signal = [RACSignal createSignal:^RACDisposable *(id<RACSubscriber> ...
- C语言的结构体的具体作用是?
在实际问题中,一组数据往往具有不同的数据类型.例如,在学生登记表中,姓名应为字符型:学号可为整型或字符型:年龄应为整型:性别应为字符型:成绩可为整型或实型.显然不能用一个数组来存放这一组数据.因为数组 ...
- prim 模板
#include<cstdio> #include<vector> #include<cstring> #include<set> #define ma ...
- Anaconda概念和使用方法
Anaconda概述 Anaconda是一个用于科学计算的Python发行版,支持 Linux, Mac, Windows系统,提供了包管理与环境管理的功能,可以很方便地解决多版本python并存.切 ...
- ORACLE 收缩表空间的数据文件
http://blog.itpub.net/29345367/viewspace-1816427/ 方法一: 在实际的应用中经常会遇到TRUNCATE或者DELETE表中的数据后发现表空间并没有将空间 ...
- ASP.NET-配置Dubug和Release生成不同的Web.config
配置 Dubug 和 Release 生成不同的 Web.config Web.config Transformation Syntax for Web Application Project Dep ...
- Intent的setFlag和addFlag有什么区别?
Intent的setFlag和addFlag有什么区别?setFlag是把之前的替换掉,addFlag是添加新的 Intent it=new Intent(); it.setClass(Setting ...
- 【转载】Spring boot学习记录(三)-启动原理解析
前言:本系列文章非本人原创,转自:http://tengj.top/2017/04/24/springboot0/ 正文 我们开发任何一个Spring Boot项目,都会用到如下的启动类 @Sprin ...
- JavaScript LinkedList
function LinkedList() { var Node = function(element) { this.element = element; this.next = null } va ...
- 【五一qbxt】day7-2 选择客栈
停更20天祭qwq(因为去准备推荐生考试了一直在自习qwq) [noip2011选择客栈] 这道题的前置知识是DP,可以参考=>[五一qbxt]day3 动态规划 鬼知道我写的是什么emm 这道 ...