uni-app 抖音小程序使用provide/inject 无效

uni-app 抖音小程序使用provide/inject 无效

示例代码：

父组件：provide('checkbox', 1);
子组件：inject('checkbox', null); 返回的结果是null

操作步骤：

在main.ts 中  app.provide 是可以在子组件中inject到结果的，在页面或组件中无效

预期结果：

1

实际结果：

null

bug描述：

provide/inject 失效

相关链接 ：

信息类型 信息内容
产品分类 uniapp/小程序/字节跳动
PC开发环境 Mac
OS版本 1
第三方开发者工具版本 1
基础库版本号 3.0.0-alpha-4040520250107001
项目创建方式 CLI
CLI版本号 1

更多关于uni-app 抖音小程序使用provide/inject 无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

同遇到，25年的版本都有这个问题，uni组件库的uni-grid组件在抖音端无法显示（微信端显示正常）（回退到2407左右的版本能正常显示）

更多关于uni-app 抖音小程序使用provide/inject 无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html


提供 vue和 HBuilderX 依赖版本，我 vue3 + HBuilderX4.52 运行到安卓真机抖音上正常，测试代码如下
index.vue <template>
<view>
<view>input</view>
<input v-model="str" />
<view>child</view>
<ChildComp></ChildComp>
</view>
</template>

<script> import ChildComp from './child.vue' import { computed } from 'vue' export default { data(){ return { str:'' } }, provide(){ return { str2: computed(()=>'==='+ this.str+'===') } }, components:{ChildComp}, } </script>

chid.vue <template>
<view>
<view>我是子组件</view>
<view>{{str2}}</view>
</view>
</template>

<script> export default { name: 'child', mounted() { }, inject: ['str2'], created() { console.log(this.str2); // 输出: { name: 'John Doe', email: 'john.doe@example.com' } }, methods: { } }; </script>

目前发现抖音小程序父子关系初始化比较慢， setup 中需要使用 onMounted 包裹获取 inject 展示数据。

<script setup> import {inject, onMounted, watchEffect,ref, reactive} from 'vue' const injectValue = reactive({value:''}) onMounted(()=>{ const _inject = inject('str2', 'default') injectValue.value = _inject }) </script>

你可以参考兼容处理，后续找到合理的方案会进行更新。

回到顶部