【报Bug】抖音小程序使用provide/inject 无效

分类：uni-app

bug反馈

产品分类： uniapp/小程序/抖音

PC开发环境操作系统： Mac

PC开发环境操作系统版本号： 1

第三方开发者工具版本号： 1

基础库版本号： 3.0.0-alpha-4040520250107001

项目创建方式： CLI

CLI版本号： 1

示例代码：

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

操作步骤：

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

预期结果：

1

实际结果：

null

bug描述：

provide/inject 失效

2025-02-08 16:00 负责人:DCloud_UNI_OttoJi 分享

5 个回复

xueyitt

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

DCloud_UNI_OttoJi - 日常回复 uni-app/x 问题，如果艾特我没看到，请主动私信

提供 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>

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