vue的依赖注入provide和inject
一、解决的场景问题:
根父组件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的更多相关文章
- Vue.js 源码分析(八) 基础篇 依赖注入 provide/inject组合详解
先来看看官网的介绍: 简单的说,当组件的引入层次过多,我们的子孙组件想要获取祖先组件的资源,那么怎么办呢,总不能一直取父级往上吧,而且这样代码结构容易混乱.这个就是这对选项要干的事情 provide和 ...
- Spring的核心机制——依赖注入(Dependency Inject)
Spring不仅提供对象,还提供对象的属性值,而不是由使用该对象的程序所提供的. Java应用是由一些相互协作的对象所组成的,在Spring中这种相互协作的关系就叫依赖关系. 如果A组件调用了B组件的 ...
- Spring的核心机制——依赖注入(Dependency Inject)
Spring不仅提供对象,还提供对象的属性值,而不是由使用该对象的程序所提供的. Java应用是由一些相互协作的对象所组成的,在Spring中这种相互协作的关系就叫依赖关系. 如果A组件调用了B组件的 ...
- vue之provide和inject跨组件传递属性值失败(父组件向子组件传值的两种方式)
简单介绍:当一个子组件需要用到父组件的父组件的某些参数.那么这个时候为了避免组件重复传参,使用vue的依赖注入是个不错的方法,直接在最外层组件设置一个provide,内部不管多少嵌套都可以直接取到最外 ...
- ASP.NET Core 2.2 基础知识(一) 依赖注入
依赖: 类A用到了类B,我们就说类A依赖类B.如果一个类没有任何地方使用到,那这个类基本上可以删掉了. public class Test { private MyDependency md = ne ...
- VUE3 之 ref、provide、inject 的使用 - 这个系列的教程通俗易懂,适合新手
1. 概述 首因效应告诉我们: 在日常交往中,第一印象是非常重要的,好的第一印象能让我们在与人相处时事半功倍. 但也从另一面告诉我们,不能仅凭第一印象去判断一个人,有时虚假的第一印象,也有可能蒙蔽我们 ...
- Vue实战指南之依赖注入(provide / inject)
案例 UI美眉说咱家的选项菜单太丑了,小哥哥能不能美化一下呀,洒家自然是说小意思啦~自定义一个select组件,so easy~ 简单粗暴型: <el-select v-model=" ...
- 051_末晨曦Vue技术_处理边界情况之provide和inject依赖注入
provide和inject依赖注入 点击打开视频讲解更详细 在此之前,在我们描述访问父级组件实例的时候,展示过一个类似这样的例子: <google-map> <google-map ...
- vue的provide和inject特性
由来 组件之间的通信可以通过props和$emit的方式进行通信,但是如果组件之间的关系非常复杂的话,通过以上的方式会很麻烦,并且程序会非常脆弱,没有建中性可言. 在==vue2.2.0 中新增pro ...
随机推荐
- Ubuntu 18.04安装NVIDIA显卡驱动教程
最近遇到了在Ubuntu 18.04上安装NVIDIA显卡驱动的情况,看到一篇教程讲解的很好,拿来收藏. 安装NVIDIA显卡驱动风险极大,新手注意. 在Ubuntu 18.04上安装 ...
- Splay P3369 【模板】普通平衡树(Treap/SBT)
题目描述 您需要写一种数据结构(可参考题目标题),来维护一些数,其中需要提供以下操作: 插入x数 删除x数(若有多个相同的数,因只删除一个) 查询x数的排名(排名定义为比当前数小的数的个数+1.若有多 ...
- Spring注解不生效
如果在使用spring中,发现注解不生效,检查下如下配置是否配置. 1:一般情况下@Autowired默认是不生效的,配置之后,才会生效 <context:annotation-config / ...
- 小程序 之自定义tabbar上边框颜色
一.设置borderStyle 二.设置page样式 page::after{ content: ''; position: fixed; left: 0; bottom: 0; width: 100 ...
- linux的free命令详解-内存是拿来用的不是拿来看的
$ free -m total used free shared buffers cached Mem: -/+ buffers/cache: Swap: 第一部分Mem行:total 内存总数: 1 ...
- 第六章、Linux 的档案权限不目彔配置
1. 使用者不群组 2. Linux 档案权限概念 2.1 Linux 文件属怅 2.2 如何改变文件属怅不权限: chgrp, chown, chmod 2.3 目彔不档案乀权限意丿 2.4 Lin ...
- java中 什么是反射?
JAVA反射机制是在运行状态中,对于任意一个实体类,都能够知道这个类的所有属性和方法: 对于任意一个对象,都能够调用它的任意方法和属性:这种动态获取信息以及动态调用对象方法的功能称为java语言的反射 ...
- 面试题小议---BY gremount
Problem 1: 两个烧杯,一个放糖一个放盐,用勺子舀一勺糖到盐,搅拌均匀,然后舀一勺混合物会放糖的烧杯,问你两个烧杯哪个杂质多? 提示:相同.(1)可以用一个特殊数据计算一下,可以得到两个烧杯 ...
- CodeForces - 1175D Array Splitting(数组划分+后缀和+贪心)
You are given an array a1,a2,…,ana1,a2,…,an and an integer kk. You are asked to divide this array in ...
- 20165223《网络对抗技术》Exp 8 Web基础
目录 -- Web基础 实践说明 实践目标 基础问答 实践内容 Web前端:HTML Web前端:JavaScript Web后端:MySQL Web后端:PHP SQL注入,XSS攻击测试 实验遇到 ...