w***@163.com
w***@163.com
  • 发布:2025-02-08 16:00
  • 更新:2025-02-10 20:41
  • 阅读:44

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

分类:uni-app

产品分类: 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 分享
已邀请:
xueyitt

xueyitt

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

DCloud_UNI_OttoJi

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>

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

要回复问题请先登录注册