7***@qq.com
7***@qq.com
  • 发布:2019-04-28 16:01
  • 更新:2021-04-27 11:16
  • 阅读:10912

【已解决】#插件讨论# 【 Popup 弹出层 - DCloud 】引入组件都不行

分类:uni-app

引入组件报错:
Unknown custom element: <uni-popup> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

2019-04-28 16:01 负责人:无 分享
已邀请:
1***@qq.com

1***@qq.com - gladming

我是npm安装的,找到原因了,没有引入组件
import { uniPopup } from '@dcloudio/uni-ui';
然后components: { uniPopup },ok搞定!

6***@qq.com

6***@qq.com

刚解决了以上报错问题 产生原因是 在使用uni-popup-dialog uni-popup-message是 需要自己引入组件
import uniPopup from '@/components/uni-popup/uni-popup.vue';
import uniPopupDialog from '@/components/uni-popup/uni-popup-dialog.vue';
与uni-popup引入位置相同
官方在设计组件的时候 可能不清楚你到底想用哪个组件作为弹窗 所以没有引入组件 根据需要 引入插件包中的组件即可

1***@qq.com

1***@qq.com

文件引入,只需要将uni-popup文件放在components文件夹内,就可以自动引入了,不需要特别的去注册组件;

ZGH0709

ZGH0709

其他组件可以正常使用吗?

DCloud_UNI_CHB

DCloud_UNI_CHB

需要说明具体使用情况:

  • uni-popup是如何安装的?插件市场下载的,还是npm安装的?
  • 页面如何调用的?需要示例代码
7***@qq.com

7***@qq.com

解决了嘛?我也遇到相同的问题

  • DCloud_UNI_CHB

    参考上条回复,补充你的详细使用情况。

    2019-05-13 09:04

  • YNNNNNN

    回复 DCloud_UNI_CHB: 我贴上了代码,跟答主一样的问题,能看看是怎么回事吗

    2019-05-13 11:16

YNNNNNN

YNNNNNN - 切图囡

npm安装,

import {  
        uniPopup  
    } from '@dcloudio/uni-ui'
<uni-popup :show="middle" type="middle" mode="fixed" msg="居中弹出popup" @hidePopup="hidePopup">  
            <view class="medio_mockup">  
                <view class="page-section page-section-gap" style="text-align: center;">  
                    <audio style="text-align: left" :src="current.src" :poster="current.poster" :name="current.name" :author="current.author"  
                     :action="audioAction" controls></audio>  
                </view>  
            </view>  
        </uni-popup>

跟题主一样的报错

  • ZGH0709

    是安装了所有插件,还是单独安装的?

    2019-05-13 11:26

  • YNNNNNN

    回复 ZGH0709: 安装了所有插件

    2019-05-13 11:29

  • ZGH0709

    回复 YNNNNNN: 插件列表应该没有吧,你看一哈,单独引入试一下

    2019-05-13 11:47

  • YNNNNNN

    回复 ZGH0709: 使用HBuilderX导入components,import { uniPopup } from '@/components/uni-popup/uni-popup.vue',依然是同样的报错,文件夹里另一个组件wuc-tab这样的引入可以正常使用

    2019-05-13 11:59

  • ZGH0709

    回复 YNNNNNN: import uniPopup from '@/components/uni-popup/uni-popup.vue'

    2019-05-13 12:10

  • YNNNNNN

    回复 ZGH0709: 还是不行,其他组件可以正常使用

    2019-05-13 13:50

  • ZGH0709

    回复 YNNNNNN: 你上传个 demo 我看一下

    2019-05-13 14:25

  • YNNNNNN

    回复 ZGH0709: 不知道怎么了,,就好了,好了··全局跟单独引入都可以了

    2019-05-13 14:45

gouzclear

gouzclear

我也遇到了..请问楼主怎么解决的

1***@qq.com

1***@qq.com - gladming

有没有人

6***@qq.com

6***@qq.com

import UniPopupShare from '@/components/uni-popup/uni-popup-share.vue';
components: {UniPopupShare }
引入这个组件就ok了

1***@qq.com

1***@qq.com

这应该是hbuilderx或者组件的一个bug,我也出现这个问题,百思不得其解。后进行下面操作后即可恢复:
1、导入组件
注:在components文件夹里放入导入的组件之前,一定不要在页面添加弹窗组件
2、点击激活组件按钮
等导入组件后,点击激活弹窗的按钮,这时肯定报错,因为咱们还没有添加uni-popup相关组件,
3、把你之前写好的组件再放进原位置,再次点击激活组件按钮,嗯嗯,百分百不报错【注:不需要引入,直接放组件即可】

我已经来回试了n遍了,每遍都成功,只要添加组件前写的组件插件,就会报错

8***@qq.com

8***@qq.com

<!-- 对话框 -->  
        <uni-popup id="popupDialog" ref="popupDialog" type="dialog" @change="change">  
            <uni-popup-dialog :type="msgType" title="通知" content="欢迎使用 uni-popup!" :before-close="true" @confirm="dialogConfirm" @close="dialogClose"></uni-popup-dialog>  
        </uni-popup>
``````javascript  
this.$refs.popupDialog.open();

chunk-vendors.js:4070 [Vue warn]: Unknown custom element: <uni-popup-dialog> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

found in

---> at pages/legalDiscipline/lawReviewArticles/test_popup.vue

  • 插件市场导入直接使用报错,其他插件未发现这个问题

该问题目前已经被锁定, 无法添加新回复