当前位置: 首页 > news >正文

vue里provide作用:将一组全局方法注入到 Vue 应用的所有子组件中

在 Vue.js 中, provide('mainFunc', {...}) 是依赖注入(Dependency Injection)的提供者(provider)部分,它的作用是:

  1. 功能说明 :
  • 将一组全局方法注入到 Vue 应用的所有子组件中
  • 子组件可以通过 inject 接收这些方法
import { provide, ref, onMounted } from 'vue';function jumpRouter(name: string, query: any = {}) {router.push({name: name,query: query})
}function getUserInfo() {return headerRef.value.getUserInfo();
}provide('mainFunc', {getUserInfo,    // 获取当前用户信息jumpRouter,     // 路由跳转方法
})
  1. 使用场景 :
  • 任何子组件都可以通过以下方式使用:
const mainFunc = inject('mainFunc')
mainFunc.jumpRouter('Menu') // 跳转到菜单页
  1. 设计优势 :
  • 避免了多层组件 props 传递
  • 集中管理常用功能方法
  • 保持代码整洁和可维护性
    这相当于创建了一个全局可用的"工具箱",任何子组件都可以按需取用其中的工具方法。
http://www.dtcms.com/a/135404.html

相关文章:

  • 【正点原子STM32MP257连载】第四章 ATK-DLMP257B功能测试——USB测试 #USB HOST #USB 鼠标
  • 京东硬核挑战潜规则,外卖算法要变天?
  • 阶段性使用总结-通义灵码
  • 协程从原理到最新的c++协程特性
  • 从服务器多线程批量下载文件到本地
  • 4.14【Q】pc homework3
  • 有序二叉树各种操作实现(数据结构C语言多文件编写)
  • 基础知识:Dify 错误排查
  • 基础学习(4): Batch Norm / Layer Norm / Instance Norm / Group Norm
  • ReactNative中处理安全区域问题
  • 深入解析 OrdinalEncoder 与 OneHotEncoder:核心区别与实战应用
  • Linux——信号量
  • linux 内核 ida机制分析
  • 【SpringMVC】深入解析自定义拦截器、注册配置拦截器、拦截路径方法及常见拦截路径、排除拦截路径、拦截器的执行流程
  • 视觉SLAM和激光SLAM建图输出的文件类型
  • 域控制器升级的先决条件验证失败,证书服务器已安装
  • 基于大模型的反流食管炎手术全流程风险预测与治疗方案研究报告
  • 【钱包】Tron签名总结
  • c# 数据结构 链表篇 有关双向链表的一切
  • Vue el-from的el-form-item v-for循环表单如何校验rules(一)
  • TMS320F28P550SJ9学习笔记15:Lin通信SCI模式结构体寄存器
  • 【Java学习】Knife4j使用流程
  • MongoDB常见语句
  • dsp的主码流,子码流是指什么,有什么区别和作用
  • 实践001-Gitlab基础项目准备
  • [MySQL] 事务管理(一) 事务的基本概念
  • Python基础知识(基础语法二)
  • 【ROS2】行为树 BehaviorTree(六):各种各样的节点
  • 循环神经网络 - 扩展到图结构之递归神经网络
  • AI核心概念之“Function Calling” - 来自DeepSeek