一、vue中，默认情况下，调用组件时，传入一些没有在props中定义的属性，会把这些“非法”属性渲染在组件的根元素上（有一些属性除外），而这些“非法”的属性会记录在$attrs属性上。

二、如何控制不把这些非法的属性渲染在组件的根元素上呢？答案是在组件内部设置inheritAttrs:false即可。

三、通过v-bind="$attrs"可以把“非法”的属性渲染到指定的组件某个元素上。

四、如下图

vue中的$attrs属性和inheritAttrs属性的更多相关文章

  1. vue中关于v-for性能优化---track-by属性

    vue中关于v-for性能优化---track-by属性 最近看了一些react,angular,Vue三者的对比文章,对比来说Vue比较突出的是轻量级与易上手. 对比Vue与angular,Vue有 ...

  2. vue中书写JSX一些坑-特殊属性名

    举例说明, T1和T2引用Sub时, key2会出现在props以及data.attrs中, 而key则在data中 const Sub = ({data, props}) => { conso ...

  3. Vue中methods(方法)、computed(计算属性)、watch(侦听器)的区别

    1.computed和methods 共同点:computed能现实的methods也能实现: 不同点:computed是基于它的依赖进行缓存的.computed只有在它的相关依赖发生变化才会重新计算 ...

  4. vue 中contenteditable="true"添加可编辑属性后v-model双向绑定失效的解决办法

    在项目中会遇到需要编辑单元格的双向绑定问题,v-model双向绑定会在添加contenteditable="true"属性后失效解决方法如下,亲测好用(v-html和@blur实现 ...

  5. 为什么vue中的v-bind用在class属性上有点怪？

    如图所见,普通的标签属性我们直接使用 :属性名=`props的值` 就可以了.为什么用到class里要加[ ] 这个???

  6. Vue.js-05：第五章 - 计算属性与监听器

    一.前言 在 Vue 中,我们可以很方便的将数据使用插值表达式( Mustache 语法)的方式渲染到页面元素中,但是插值表达式的设计初衷是用于简单运算,即我们不应该对差值做过多的操作.当我们需要对差 ...

  7. 总结vue中父向子，子向父以及兄弟之间通信的几种方式

    子向父方式1:通过props,如例子中子组件test1.vue向父组件App.vue传值 App.vue代码 <template> <div id="app"&g ...

  8. 深入理解 vue 中 scoped 样式作用域的规则

    哈喽!大家好!我是木瓜太香,今天我们来聊一个 vue 的样式作用域的问题,通常我们开发项目的时候是要在 style 上加上 scoped 来起到规定组件作用域的效果的,所以了解他们的规则也是很有必要的 ...

  9. 详解Vue中的computed和watch

    作者:小土豆 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.cn/user/2436173500265335 1. 前言 作为一名Vue ...

随机推荐

  1. Linux disk 100% busy，谁造成的？

    disk 100% busy,谁造成的? 2016/11/16 vmunix iostat等命令看到的是系统级的统计,比如下例中我们看到/dev/sdb很忙,如果要追查是哪个进程导致的I/O繁忙,应该 ...

  2. iptables防火墙--------基本操作

    查看规则 查看filter表中的规则 $ iptables -t filter -L 使用-t选项,指定要操作的表.使用-L 选项,查看-t选项对应表的规则,-L 选项的意思是,列出规则. ps : ...

  3. 判断声明出来的list为空的时候，list！=null

    判断声明出来的list为空的时候,listjcxm!=null&&listjcxm.size()==0: 有时候list不为null但是size为0 map也是类似

  4. ORBSLAM2单目初始化过程

    ORBSLAM2单目初始化过程 转自博客:https://blog.csdn.net/zhubaohua_bupt/article/details/78560966 ORB单目模式的初始化过程可以分为 ...

  5. JAVA基础知识|Serializable

    一.序列化和反序列化 序列化:把对象转换为字节序列的过程称为对象的序列化. 反序列化:把字节序列恢复为对象的过程称为对象的反序列化. 将内存中对象的信息保存下来,可以有很多种方式实现这一功能.其中ja ...

  6. LUA upvalues

    1 upvalue概念 upvalue:嵌套函数的外部函数的局部变量 function func(a) <== 这个函数返回值是一个函数 return function () a = a + 1 ...

  7. 5.linux 软件安装的三种方法

      一.linux 操作系统中 软件的分类 以及软件的安装     vmtools  调用了perl语言写的安装脚本去进行内核的升级安装  ./ xxxxx        源码包安装软件:GNU  使 ...

  8. bash常用的快捷键

    bash常用快捷键 快捷键 作用 CTRL+A 把光标移动到命令行开头.如果我们输入的命令过长,则在想要把光标移动到命令行开头时使用 CTRL+E 光标移动到命令行行尾 CTRL+C 强制中止当前命令 ...

  9. 小福bbs-凡事预则立

    [小福bbs-凡事预则立] 1.冲刺的时间计划安排(冲刺时间为期七天,安排在2019-11-3--2019-11-14之间) 冲刺的时间 计划安排 2019.11.7 开会,安排具体工作 2019.1 ...

  10. T-MAX组--项目冲刺（第一天）

    THE FIRST DAY 项目相关 作业相关 具体描述 所属班级 2019秋福大软件工程实践Z班 作业要求 团队作业第五次-项目冲刺 作业正文 T-MAX组--项目冲刺(第一天) 团队名称 T-MA ...