斑码开发者
斑码开发者
  • 发布:2022-07-30 17:38
  • 更新:2022-08-02 11:50
  • 阅读:658

【报Bug】自定义组件任然无法引入

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: Win10

HBuilderX类型: 正式

HBuilderX版本号: 3.5.3

手机系统: iOS

手机系统版本号: iOS 15

手机厂商: 苹果

手机机型: ipad

页面类型: nvue

vue版本: vue3

打包方式: 离线

项目创建方式: HBuilderX

操作步骤:

Failed to resolve component

预期结果:

页面正常显示

实际结果:

Failed to resolve component,无法显示,
很奇怪,首页scoller组件没有问题的,但是这个就有问题了,我以为自己写错了,结果我把scoller改成scoller1,又报错了
这个问题很严重,组件引入不了,这个bug明显没有修复掉
11:02:38.334 App Show at App.vue:28
11:02:38.365 [Vue warn]: Failed to resolve component: cu-struct
11:02:38.396 If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.
11:02:38.428 at <Index pageId=1 pagePath="pages/goods/index" pageQuery= {} > WARN

bug描述:

组件任然无法引入

export function createApp() {  
    const app = createSSRApp(App);  
    app.use(store);  
    console.log(cu-struct);  
    app.config.compilerOptions.isCustomElement = tag => tag.startsWith('cu-struct');  
    app.component('cu-struct', cuStruct);  
    return {  
        Vuex,  
        app  
    }  
}
<template>  
    <view class="page w-100 d-flex-col flex-1 position-relative animated fadeIn faster">  
        www  
    </view>  
</template>  

<script>  

    export default {  
        props: {  

        },  
        methods: {  

        }  
    }  
</script>  

<style>  

</style>
<template>  
    <view class="page w-100 d-flex-col flex-1 position-relative animated fadeIn faster bg-white">  

        <cu-struct class="w-100 height-100"></cu-struct>  
    </view>  
</template>  

<script>  
    let isPull = false;  
    let limit = 10;  
    let timer = null;  
    let screenX = 0;  
    import {mapState,mapActions} from 'vuex';  
    import scroller from "@/components/common/scroller.vue";  
    import cuStruct from "@/components/common/cu-struct.vue";  
    export default {  
        components(){  
            scroller,cuStruct  
        },  
        data() {  
            return {  
                navPell:0,  
                StatusBar: this.StatusBar,  
                CustomBar: this.CustomBar,  
                NavationBar: this.CustomBar-this.StatusBar,  
                TopBar: this.CustomBar+uni.upx2px(100),  
                BackgroundBar: this.CustomBar+uni.upx2px(120),  
                uWidth:0  

            }  
        },  
        computed: {  
            ...mapState({  
                loginStatus:state=>state.user.loginStatus,  
                userInfo:state=>state.user.userInfo,  
                deviceInfo:state=>state.nav.deviceInfo,  
                menu:state=>state.nav.menu,  
                activeIndex:state=>state.nav.activeIndex,  
            })  
        },  
        watch:{  
            loginStatus(){  

            }  
        },  
        onLoad(options) {  
            uni.hideTabBar();  
        },  
        onShow() {  
        },  
        onShareAppMessage(){  

        },  
        onShareTimeline(){  

        },  
        methods: {  

        }  
    }  
</script>  

<style>  
    /* #ifndef APP-PLUS */  
    page {  
        width: 100%;  
        min-height: 100%;  
        display: flex;  
    }  
    /* #endif */  

</style>
2022-07-30 17:38 负责人:DCloud_UNI_FXY 分享
已邀请:
DCloud_UNI_FXY

DCloud_UNI_FXY

发完整的测试工程

  1. 在main.js中注册了全局组件cu-struct,又配置isCustomElement,这是没有意义的,为何要配置isCustomElement呢,他是解决原生组件的问题,不是解决引入自定义组件的问题。文档:https://staging-cn.vuejs.org/api/application.html#app-config-compileroptions
  2. 既然全局注册了,为何页面上又再引入一遍?

要回复问题请先登录注册