当在一个自定义组件上使用 class 属性时,这些类将被添加到该组件的根元素上面。这个元素上已经存在的类不会被覆盖。

例如,如果你声明了这个组件:

Vue.component('my-component', {
template: '<p class="foo bar">Hi</p>'
})

然后在使用它的时候添加一些 class:

<my-component class="baz boo"></my-component>

HTML 将被渲染为:

<p class="foo bar baz boo">Hi</p>

vue class绑定 组件的更多相关文章

  1. vue 实现父组件和子组件之间的数据双向绑定

    前言:vue 实现父组件给子组件传值,然后子组件可以修改回父组件的值.vue 的 prop 默认是单向数据绑定,但是偶尔需要双向绑定,这时就需要知道如何才能让子组件的数据修改时影响到父组件的数据.转载 ...

  2. react第十一单元(受控组件和非受控组件-实现类似于vue双向绑定的功能)

    第十一单元(受控组件和非受控组件-实现类似于vue双向绑定的功能) #课程目标 理解因为react的单向数据流 理解表单组件会因为react数据流变的不好维护 理解受控组件与非受控组件的实质区别 理解 ...

  3. Vue.js说说组件

    什么是组件:组件是Vue.js最强大的功能之一.组件可以扩展HTML元素,封装可重用的代码.在较高层面上,组件是自定义的元素,Vue.js的编译器为它添加特殊功能.在有些情况下,组件也可以是原生HTM ...

  4. 基于Vue封装分页组件

    使用Vue做双向绑定的时候,可能经常会用到分页功能 接下来我们来封装一个分页组件 先定义样式文件 pagination.css ul, li { margin: 0px; padding: 0px;} ...

  5. 【原】vue单文件组件互相通讯

    在vue中,我们可以把一个页面各个部分单独封装起来,做成各种小组件,然后加载,这样的好处是代码维护起来比较容易,重复的代码多处调用! 在一个vue项目中,单文件组件以.vue形式文件命名 每个组件之间 ...

  6. vue.js之组件(上篇)

    本文的Demo和源代码已放到GitHub,如果您觉得本篇内容不错,请点个赞,或在GitHub上加个星星! https://github.com/zwl-jasmine95/Vue_test 以下所有知 ...

  7. vue的常用组件方法应用

    项目技术: webpack + vue + element + axois (vue-resource) + less-loader+ ... vue的操作的方法案例: 1.数组数据还未获取到,做出预 ...

  8. vue.js之组件篇

    Vue.js 组件 模块化:是从代码逻辑的角度进行划分的: 组件化:是从UI界面的角度进行划分的. 组件(Component)是 Vue.js 最强大的功能之一,组件可以扩展 HTML 元素,封装可重 ...

  9. vue(3)—— vue的全局组件、局部组件

    组件 vue有局部组件和全局组件,这个组件后期用的会比较多,也是非常重要的 局部组件 template与components属性结合使用挂载 其中 Vmain.Vheader.Vleft.Vconte ...

随机推荐

  1. 【java基础 12】HashMap中是如何形成环形链表的?

    导读:经过前面的博客总结,可以知道的是,HashMap是有一个一维数组和一个链表组成,从而得知,在解决冲突问题时,hashmap选择的是链地址法.为什么HashMap会用一个数组这链表组成,当时给出的 ...

  2. RHEL 7.3修改网卡命名规则为ethX

    RHEL 7网卡默认命名规则:以太网卡(Ethernet)为enX,无线网卡(WLAN)为wlX,修改网卡命名规则为ethX如下: 1.修改/etc/sysconfig/grub文件,添加net.if ...

  3. PHP_命名空间

    namespace NS; define(__NAMESPACE__ .'\foo','111'); define('foo','222'); echo foo; // 111. echo \foo; ...

  4. 【Luogu】P2351吊灯(脑洞后模拟)

    题目链接 这题要智商qwq.玩不来玩不来. 观察到(个P,能观察到的全都是dalao)x是解的充要条件是至少有n/x个节点的size是x的倍数. 证明请看这里 然后这题就变模拟了呀. #include ...

  5. 关于 __int128

    __int128 是 GCC 提供的扩展(extension),可以当作 128 位整数使用. 关于 __int128 和 __int128_t Normally, _t suffix means a ...

  6. 浅谈Android反调试 之 PTRACE_TRACEME

    反调试原理: 关于Ptrace:  http://www.cnblogs.com/tangr206/articles/3094358.html ptrace函数 原型为:     #include & ...

  7. bzoj 3924 幻想乡战略游戏

    题目大意: 有边权点权的树,动态修改点权 每次修改后求带权重心x (\(minimize\) \(S=\sum_i val[i]*dist[x][i]\)) 分析: 从暴力找突破口: 对于边x,y,设 ...

  8. APUE 学习笔记(七) 信号

    1.信号是软件中断,提供一种异步处理事件的方法 很多事件产生信号: (1)用户按下某些中断键,如 Ctrl + C键产生 SIGINT信号 (2)硬件异常产生信号,比如 除数为0,无效的内存引用  ( ...

  9. 乘法逆元__C++

    在开始之前我们先介绍3个定理: 1.乘法逆元(在维基百科中也叫倒数,当然是 mod p后的,其实就是倒数不是吗?): 如果ax≡1 (mod p),且gcd(a,p)=1(a与p互质),则称a关于模p ...

  10. android 设置app root权限简单方法

    vim frameworks/base/core/java/com/android/internal/os/ZygoteConnection.java +709 private static void ...