一、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. hive,把一个表中计算好的数据,存到另一个外部表中

    直接上代码: 第一部分: case class OrdPacsresult_obj(pk_dcpv: String, result_obj: String) 第二部分: def ordsubj: Un ...

  2. [剖析] 多路径ALUA技术如何优化I/O处理

    什么是ALUA多路径机制 ALUA是异步逻辑单元访问(Asymmetric Logical Unit Access)的缩写,ALUA是SPC3 (SCSI Primary commands-3)协议中 ...

  3. TensorFlow(六)：tensorboard网络结构

    # MNIST数据集 手写数字 import tensorflow as tf from tensorflow.examples.tutorials.mnist import input_data # ...

  4. Shadows 使用说明

    1:下载最新版 Windows地址:点击下载 Mac地址:点击下载 2:Windows安装插件(点击下方插件名即可下载) .NET Framework 4.7.2和 Microsoft Visual ...

  5. (转)kvm初识

    一 虚拟化介绍 1 常见虚拟化软件VMware系列VMware workstation.VMware vsphere(VMware esxi).VMware Fusion(Mac) Xen 开源 半虚 ...

  6. python3 系统监控脚本(2) （监控CPU，内存等信息）

    #!/usr/bin/env python3 #create at 2018-12-04 'this is a system monitor scripts' __author__="yjt ...

  7. ubuntu dnsmasq

    /var/run/NetworkManager/resolv.conf 而你真实的dns服务器地址,是被这个服务管理维护着的/ local process -> local dnsmasq -& ...

  8. fdisk创立主分区过程

    [root@localhost ~]# fdisk /dev/sdb …省略部分输出… Command (m for help): p #显示当前硬盘的分区列表 Disk /dev/sdb: 21.5 ...

  9. Cesium入门-2-增加地形

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. sklearn.GridSearchCV选择超参

    from sklearn import datasets from sklearn.model_selection import train_test_split from sklearn.model ...