首页 > 其他分享 >vue中使用provide和inject依赖注入组件之间进行父子组件传值(也适用于嵌套路由)

vue中使用provide和inject依赖注入组件之间进行父子组件传值(也适用于嵌套路由)

时间:2023-08-01 09:57:46浏览次数:38  
标签:vue provide reload inject 组件 传值

 

 

父组件中:

provide: function() {
  return {
   reload: this.reload // 父组件中的方法
  }
}


子组件中:
inject: ['reload']

使用:this.reload() // 也可传入参数

标签:vue,provide,reload,inject,组件,传值
From: https://www.cnblogs.com/lyt520/p/17595645.html

相关文章

  • 组件化、跨平台…未来前端框架将如何演进?
    前端框架在过去几年间取得了显著的进步和演进。前端框架也将继续不断地演化,以满足日益复杂的业务需求和用户体验要求。从全球web发展角度看,框架竞争已经从第一阶段的前端框架之争(比如Vue、React、Angular等),过渡到第二阶段的框架之争(比如Next、Nuxt、Remix、小程序等)。组件化开发的......
  • 若误删了系统某组件或注册表引起系统不稳定或杂疑问题的解决方法之一
    若误删了系统某组件或注册表引起系统不稳定或杂疑问题的解决方法:方法1:恢复到先前的系统还原点打开"控制面板-选择大图标-恢复-系统还原-上个还原点",它可以还原系统文件和设置,从而解决我们所遇到的问题方法2:使用 sfc/scannow 命令检查和修复系统文件的完整性。以下是在Win......
  • 自定义Android组件之带图像的TextV…
    本文为新书《Android/OPhone开发完全讲义》的内容连载。《Android/OPhone开发完全讲义》一书将在近期出版,敬请关注。 Android系统支持的图像格式)的TextView组件。在编写代码之前,先看一下Android组件的配置代码。1.<TextViewandroid:id="@+id/textview1"android:layout_width......
  • vue-scrollmagic 滚动动画制作插件
     1、需求:在做网站的时候、需要加一个根据页面滚动位置进行页面变化的效果。2、实现方案:自己写个滚动监听也不是很复杂、但是管理维护起来比较乱。所以直接找了这个插件官网:vue-scrollmagic、插件地址3、使用:安装npmivue-scrollmagic--save载入//main.jsimportV......
  • Unity UGUI的Shadow(阴影)组件的介绍及使用
    UnityUGUI的Shadow(阴影)组件的介绍及使用1.什么是Shadow(阴影)组件?Shadow(阴影)组件是UnityUGUI中的一个特效组件,用于在UI元素上添加阴影效果。通过调整阴影的颜色、偏移、模糊等属性,可以使UI元素看起来更加立体和有层次感。2.Shadow(阴影)组件的工作原理Shadow(阴影)组件......
  • 大二暑期实习记录(一):处理组件绑定数据错误(数组解构,map()方法)
    好家伙,搬砖 今天在做组件迁移(从一个旧平台迁移到一个新平台)的时候,发现了一些小小的问题: 1.错误描述:在穿梭框组件中,使用"节点配置"方法添加数据的时候,左测数据选择框直接消失了这里我们猜测一下,大概是数据处理出了问题此处,我们使用"数据绑定"绑定数据方法: ......
  • vue循环生成echarts图表
    1.效果图2.引入echartsnpminstallecharts--save3.main.js全局引入4.页面data数据是从后台接口中返回的,需要通过watch监听来获取created方法中获取到的数据。用mounted由于是异步调用,是获取不到created中的数据的。4.后台数据我这里是根据实际业务场景返回的map......
  • ruby web 实战(9)-vue 3基础(2)
    目录定位到导入的vue定位到导入的vue使用导入映射表(ImportMaps)来告诉浏览器如何定位到导入的vue:<!doctypehtml><htmllang="zh"><head><metacharset="utf-8"><title>world</title></head><body><scriptt......
  • three.js学习1(vue3)
    1.引入threejsnpminstall--savethree在组件内import*asTHREEfrom'three'2.创建容器创建canvas标签,为3D渲染建立容器<template><div><canvasid="three"></canvas></div></template>3.创建场景 Three.js依赖......
  • vue多选框
    vue多选框多选框(选中传id)效果图点击确定后传入后台id前端具体实现-vue+elementui前台变量首先使用selecctDeptMent方法从后台数据库,查询到所有的部门信息,存入到optionList中然后取出这个部门名称constoptions=ref([])//代码修改/**新增按钮操作*/const......