lanxiz
lanxiz
  • 发布:2024-11-28 16:39
  • 更新:2024-11-28 16:56
  • 阅读:41

在layout default 中 使用 provide slot 内使用 inject 报错 子组件使用 inject 正常

分类:uni-app

产品分类: uniapp/H5

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: win11 23H2

HBuilderX类型: 正式

HBuilderX版本号: 4.29

浏览器平台: Chrome

浏览器版本: 版本 131.0.6778.86(正式版本) (64 位)

项目创建方式: HBuilderX

示例代码:

layout/default.vue:

<template>  
  <slot />  
  <div ref="elRef"></div>  
  <BaseComponent />  
</template>  

<script lang="ts" setup>  
import { ref } from 'vue'  
import BaseComponent from './BaseComponent.vue'  

const elRef = ref()  

provide('elRef', elRef)  

onMounted(() => {  
  console.log('elRef:', elRef.value)  
})  
</script>

pages/index/index.vue


<template>  
  <view></view>  
</template>  

<script setup lang="ts">  
import { inject, ref } from 'vue'  

const title = ref('Hello')  

const elRef = inject('elRef')  

onMounted(() => {  
  console.log('

操作步骤:

如上代码

预期结果:

slot 内 正常使用 inject

实际结果:

inject 报错:
uni-h5.es.js:15847 [Vue warn]: injection "elRef" not found.

bug描述:

在layout default 中 使用 provide, slot 内使用 inject 报错 子组件使用 inject 正常

2024-11-28 16:39 负责人:无 分享
已邀请:
DCloud_UNI_yuhe

DCloud_UNI_yuhe

provide 和 inject 必须得再一个组件树中,你给出的 layout/default.vue 和 pages/index/index.vue 看起来也没有什么联系。

  • lanxiz (作者)

    刚刚发现了 当时脑子有点短路 没有想到

    2024-11-28 17:04

要回复问题请先登录注册