一、解决的场景问题:

  根父组件A有一个方法getMap,该组件A下的所有子组件B,子组件C,子组件D,或者子组件B下的子组件E等层层嵌套情况下,在某种情况下,都需要访问父组件的getMap方法,那么常用的方法是子组件B:this.$parent.getMap(),组件E则是:this.$parent.$parent.getMap()以此类推;这种情况下,使用 $parent 属性无法很好的扩展到更深层级的嵌套组件上。

二、解决方式如下

  根组件A使用provide对外提供被访问的函数,子组件使用inject“导入”父组件的函数即可

vue的依赖注入provide和inject的更多相关文章

  1. Vue.js 源码分析(八) 基础篇 依赖注入 provide/inject组合详解

    先来看看官网的介绍: 简单的说,当组件的引入层次过多,我们的子孙组件想要获取祖先组件的资源,那么怎么办呢,总不能一直取父级往上吧,而且这样代码结构容易混乱.这个就是这对选项要干的事情 provide和 ...

  2. Spring的核心机制——依赖注入(Dependency Inject)

    Spring不仅提供对象,还提供对象的属性值,而不是由使用该对象的程序所提供的. Java应用是由一些相互协作的对象所组成的,在Spring中这种相互协作的关系就叫依赖关系. 如果A组件调用了B组件的 ...

  3. Spring的核心机制——依赖注入(Dependency Inject)

    Spring不仅提供对象,还提供对象的属性值,而不是由使用该对象的程序所提供的. Java应用是由一些相互协作的对象所组成的,在Spring中这种相互协作的关系就叫依赖关系. 如果A组件调用了B组件的 ...

  4. vue之provide和inject跨组件传递属性值失败(父组件向子组件传值的两种方式)

    简单介绍:当一个子组件需要用到父组件的父组件的某些参数.那么这个时候为了避免组件重复传参,使用vue的依赖注入是个不错的方法,直接在最外层组件设置一个provide,内部不管多少嵌套都可以直接取到最外 ...

  5. ASP.NET Core 2.2 基础知识(一) 依赖注入

    依赖: 类A用到了类B,我们就说类A依赖类B.如果一个类没有任何地方使用到,那这个类基本上可以删掉了. public class Test { private MyDependency md = ne ...

  6. VUE3 之 ref、provide、inject 的使用 - 这个系列的教程通俗易懂,适合新手

    1. 概述 首因效应告诉我们: 在日常交往中,第一印象是非常重要的,好的第一印象能让我们在与人相处时事半功倍. 但也从另一面告诉我们,不能仅凭第一印象去判断一个人,有时虚假的第一印象,也有可能蒙蔽我们 ...

  7. Vue实战指南之依赖注入(provide / inject)

    案例 UI美眉说咱家的选项菜单太丑了,小哥哥能不能美化一下呀,洒家自然是说小意思啦~自定义一个select组件,so easy~ 简单粗暴型: <el-select v-model=" ...

  8. 051_末晨曦Vue技术_处理边界情况之provide和inject依赖注入

    provide和inject依赖注入 点击打开视频讲解更详细 在此之前,在我们描述访问父级组件实例的时候,展示过一个类似这样的例子: <google-map> <google-map ...

  9. vue的provide和inject特性

    由来 组件之间的通信可以通过props和$emit的方式进行通信,但是如果组件之间的关系非常复杂的话,通过以上的方式会很麻烦,并且程序会非常脆弱,没有建中性可言. 在==vue2.2.0 中新增pro ...

随机推荐

  1. sql server set赋值和select 赋值的区别以及使用方法

    sqlserver存储过程中SELECT 与 SET 对变量赋值的区别   (备注:虽然变量赋值使用方法已经不是问题,但是,了解一下select和set赋值的区别,还是提高了不少认识.应该有很多人并不 ...

  2. sphinx和coreseek

    sphinx是国外的一款搜索软件. coreseek是在sphinx的基础上,增加了中文分词功能,换句话说,就是支持了中文. Coreseek发布了3.2.14版本和4.1版本,其中的3.2.14版本 ...

  3. 2019 ICPC Asia Yinchuan Regional

    目录 Contest Info Solutions A. Girls Band Party B. So Easy D. Easy Problem E. XOR Tree F. Function! G. ...

  4. vue中使用定时器时this指向

    箭头函数中的this指向是固定不变(定义函数时的指向),在vue中指向vue; 普通函数中的this指向是变化的(使用函数时的指向),谁调用的指向谁.   箭头函数: let timerOne = s ...

  5. P3975 (后缀自动机sort)

    题目链接: https://www.luogu.org/problem/P3975 题意: 求出所有字串的第k大子串 有两种,第一种对于出现在不同位置的相同子串算作一个子串 第二种,对于不同位置的子串 ...

  6. Concurrent初探 --- Atomic 无锁

    一.CAS算法 Compare And Swap,CAS算法的过程是这样:它包含3个参数CAS(V,E,N).V表示要更新的变量,E表示预期值,N表示新值.仅当V值等于E值时,才会将V的值设为N,如果 ...

  7. C语言的历史

    1.ALGOL语言 ALGOL ,为算法语言(ALGOrithmic Language)的缩写,是计算机发展史上首批产生的高级程式语言家族.当时还是晶体管计算机流行的时代,由于ALGOL语句和普通语言 ...

  8. ICEM-圆锥的一种画法(2D转3D)

    原视频下载地址:https://pan.baidu.com/s/1jIOEelo  密码: btap

  9. Java 面向对象(八)

    常用类之String String字符串类 什么是字符串?就是把多个字符,串连一起. String字符串的本质 其实是一个char[]数组 /**该值用于字符存储.*/ private final c ...

  10. sqlserver 触发器实例

    实例1:update USE [数据库名称]GO/****** Object: Trigger [dbo].[触发器名称] Script Date: 05/08/2014 12:40:25 ***** ...