今天在使用$attrs的时候遇到一个问题:

父组件:

<PanelContainer name="正向舆情">
<PositiveOpinion opinion="positive" />
</PanelContainer>

我在子组件中没有用props保存这个值,按理说应该会把值传给孙子层,但在孙子层通过this.$attrs.opinion并没有获取到值,

后来发现要在子组件上写:v-bind="$attrs"

<template>
<Opinion :color="$attrs.color" v-bind="$attrs"></Opinion>
</template>

这样在孙子组件就可以通过this.$attrs.opinion获取到值啦~撒花

vue多层传递$attrs的更多相关文章

  1. 【Vue】中 $attrs 中的使用方法

    vue官网是这样介绍的: 包含了父作用域中不作为 prop 被识别 (且获取) 的特性绑定 (class 和 style 除外).当一个组件没有声明任何 prop 时,这里会包含所有父作用域的绑定 ( ...

  2. vue inheritAttrs、$attrs和$listeners使用

    inheritAttrs.$attrs和$listeners使用场景: 组件传值,尤其是祖孙组件有跨度的传值. (1)inheritAttrs 属性说明:https://cn.vuejs.org/v2 ...

  3. vue 组件传值$attrs $listeners $bus provide/inject $parent/$children

    $attrs 包含了父作用域中不作为prop被识别的特性绑定,当一个组件没有声明props时,这里会包含所有父作用域的绑定, $listeneers 包含了父作用域中的v-on事件监听器,它可以通过v ...

  4. vue中的$attrs属性和inheritAttrs属性

    一.vue中,默认情况下,调用组件时,传入一些没有在props中定义的属性,会把这些“非法”属性渲染在组件的根元素上(有一些属性除外),而这些“非法”的属性会记录在$attrs属性上. 二.如何控制不 ...

  5. 组件-vue自定义方法传递

    组件样式 面包屑导航栏 js Vue.component('bannerOne', { created() { console.log(this.bigbackColor); }, props: { ...

  6. vue 多层组件相互嵌套的时候 数据源更新 dom没更新 彻底清除组件缓存

    当项目中存在多层组件相互嵌套 组件存在严重缓存时  this.$nextTick(() => { ..... }); 不管用 this.$forceUpdate(); 不管用 只能通过深拷贝浅拷 ...

  7. vue 听说你很会传值?

    前置 大小 vue 项目都离不开组件通讯, 在这里总结一下vue组件通讯方式并列出, 都是简单的例子. 适合像我这样的小白.如有错误,欢迎指正. 温馨提示: 下文没有列出 vuex, vuex 也是重 ...

  8. js 整理 前端知识点 前端面试题 (2020)(vue)

    数据类型 字符串(String).数字(Number).布尔(Boolean).对空(Null).未定义(Undefined).Symbol. 引用数据类型:对象(Object).数组(Array). ...

  9. vue组件之间通信总结(超详细)

    组件通信在我们平时开发过程中,特别是在vue和在react中,有着举足轻重的地位.本篇将总结在vue中,组件之间通信的几种方式: props.$emit $parent.$children $attr ...

随机推荐

  1. Linux安装MySql5.7及配置(yum安装)

    Linux安装MySql5.7及配置(yum安装) [root@xld ~]# rpm -q centos-release centos-release-7-7.1908.0.el7.centos.x ...

  2. Oracle11g数据文件DBF迁移

    最近接手了一个以前同事遗留下来的项目,时机比较敏感,因为要召开11届全国少数名族运动会.建国70周年,以及香港暴乱,其中网站上挂载有十几个系统的入口链接,不巧的是其中一个系统存在若口令,被公安部安全局 ...

  3. 2.proxychains----Macchanger----anonsurf

    nano /etc/proxychains.conf 激活dynamic_chain 同是启用proxy_dns 只启用IP会泄露DNS位置信息,别人就知道你在用匿名 ipconfig    ifco ...

  4. linux/linux学习笔记-初识linux(mooc)

    一.linux简介 linux版本:内核版本和发行版本 linux企业应用: 1.基于linux的企业服务器 2.linux在嵌入式领域应用 android底层Linux : ios底层unix li ...

  5. 关于linux中的目录配置标准以及文件基本信息

    关于Linux中的目录配置标准 在查看docker.k8的运行日志,修改相关的运行记录的时候,学长总是能很快地找到目录,这个多多少少和Linux的FHS(File Hierarchy Standard ...

  6. 你知道 Java 类是如何被加载的吗?

    前言 最近给一个非 Java 方向的朋友讲了下双亲委派模型,朋友让我写篇文章深度研究下JVM 的 ClassLoader,我确实也好久没写 JVM 相关的文章了,有点手痒痒,涂了皮炎平也抑制不住的那种 ...

  7. Python 入门之 推导式

    Python 入门之 推导式 推导式就是构建比较有规律的列表,生成器,字典等一种简便的方式 1.推导式 (1)列表推导式 : <1> 普通循环: [变量 for循环] print([i f ...

  8. Building and booting Nexus 5 kernel

    1. Downloading toolchain and setup. git clone https://android.googlesource.com/platform/prebuilts/gc ...

  9. 通过编写串口助手工具学习MFC过程——(十)UpdateData()用法和编辑框的赋值、取值

    通过编写串口助手工具学习MFC过程 因为以前也做过几次MFC的编程,每次都是项目完成时,MFC基本操作清楚了,但是过好长时间不再接触MFC的项目,再次做MFC的项目时,又要从头开始熟悉.这次通过做一个 ...

  10. liunx驱动----信号量的实现

    使用信号量必须包含  <asm/semaphore.h>  头文件.其中相关结构体  struct semaphore 可以通过以下几种方式来声明或者初始化. 1.void sema_in ...