Unknown custom element:<xxx>-did you register the component correctly解决方案
如图所示控制台发现了爆红(大哭):![]()

报错解释:
当我们看到报错时,我们需要看到一些关键词,比如显眼的“component”和“name”这两个单词,
因此我们就从此处切入,大概与组件有关系。找到报错的页面:
import SelectPrint from "@/components/selectPrint/index.vue";
export default {name: "",components: {SelectPrint},dicts: ["sales_attributes", "sheet_approve_flag", "sheet_source"],
本来开始看是感觉没有问题的,感觉好像本页面components 看写了几个,然后我页面往下滑动,突然发现,下面还有一个components。。。无语子哦。放在这么后面,是因为覆盖了。
只能有一个components
name:'Details',components: {SelectPrint},dicts: ["sales_attributes", "sheet_approve_flag", "sheet_source"],data() {return {//此处很多定义的数据,下面的components没有注意到};},components: { Details, Personnel, PayCode,SelectPrint},
其他情况:
1.当然出现这个报错还可能是单词写错了,如:
components写错为component,
component: { //errSelectPrint},
2.还有引入时需要检查下,就如下所示:
import SelectPrint from "@/components/selectPrint/index.vue";import { SelectPrint } from "@/components/selectPrint/index.vue";
3 .就是看看vue文件里面的 components和name是否一样
就是页面两者不要出现相同的标识,就如id一样的,保持唯一性。
import SelectPrint from "@/components/selectPrint/index.vue";
export default {name: "SelectPrint ",components: {SelectPrint},
3.1解决方式:
如果引入的组件和文件的name一样的话,是可以使用别名的,防止重复:
方式1:
import { SelectPrint as MySelectPrint } from "@/components/selectPrint/index.vue";
方式2:
components: {SelectPrint1: SelectPrint, // 使用别名// 其他组件...},
其他问题:(未解决)
我还有一次就故意把他们写一样的,然后就页面一进入(应该是初始化的时候)就卡死了,一直打不开,控制台无限加载下面图片这个警告,我知道这个是Chrome 增加了新的事件捕获机制-Passive Event Listeners,这个以前在搞地图是也遇到过,但是我也不是很清楚在只改了name和components的情况下会一直触发这个事件。但是把他们改成不一样就好了。
这个问题由于没有时间研究,看了下我就就暂时放在这了
[Violation]Added non-passive event listener to a scroll-blocking 'mousewheel' event. Consider marking event handler as 'passive' to make the page more responsive.
到后面就直接黑屏栈溢出了,应该是哪里有个死循环。
卡死问题可能不仅仅与这个组件的定义有关,还可能涉及到其他组件、数据、路由或其他一些上下文。以下是一些可能会导致页面卡死的情况:
无限循环或递归: 检查你的组件是否包含无限循环或递归,这可能会导致页面卡死。确保组件的生命周期钩子和渲染逻辑没有造成死循环。
数据加载问题: 如果组件依赖于异步数据加载,确保数据加载成功并且没有导致死锁或超时。使用浏览器开发者工具检查网络请求和响应。
其他组件问题: 页面中的其他组件也可能导致问题。尝试逐步排除其他组件,看看问题是否仍然存在。
个人的部分思路:
后面我找到了引入的组件,发现组件又引入了四个组件,前面两个组件其实是一样的,调的组件内的同一个方法但是传入的参数不一样。
组件:<AddItemGoods ref="addItemGoods" @getItemList="getItemList" /><AddAcitiveGoods ref="AddAcitiveGoods" @getItemList="getGoodsItemData" /><AddStore ref="addStore" @getStoreList="getStoreList" /><ItemPriceTable ref="itemPrice2" @getItemList="getGoodsItemData" />引入:
import AddItemGoods from "../../components/selectGoodsDialog.vue";
import AddAcitiveGoods from "../../components/selectGoodsDialog.vue";
import AddStore from "../../components/addStore.vue";
import ItemPriceTable from "../../components/ItemPrice.vue";
难道是循环引用组件的问题?
循环调用组件时,组件比vue实例后创建,官方文档中是有提到了组件必须先于实例化引入的,所以引入搞成了懒加载,还是无用
components: {Details:()=>import ("@/components/Details/index.vue")},
为了让其在vue实例化前,直接全局引入了组件?(别人写的就不改了,不敢搞哦)
import xxx from 'xxx'Vue.component("xxx",xxx)
但是好像应该不是这个问题吧?我应该没有想在点子上吧![]()
搞毛线,直接回家过年,项目能跑就行,以后再研究去了。不能一直浪费时间在天天研究这东西哦,有时间再搞。
相关文章:
Unknown custom element:<xxx>-did you register the component correctly解决方案
如图所示控制台发现了爆红(大哭): 报错解释: 当我们看到报错时,我们需要看到一些关键词,比如显眼的“component”和“name”这两个单词, 因此我们就从此处切入,大概与组件有关系。…...
计算机网络自顶向下Wireshark labs-HTTP
我直接翻译并在题目下面直接下我的答案了。 1.基本HTTP GET/response交互 我们开始探索HTTP,方法是下载一个非常简单的HTML文件 非常短,并且不包含嵌入的对象。执行以下操作: 启动您的浏览器。启动Wireshark数据包嗅探器,如Wir…...
解决pandas写入excel时的ValueError: All strings must be XML compatible报错
报错内容: ValueError: All strings must be XML compatible: Unicode or ASCII, no NULL bytes or control characters 报错背景 用pands批量写入excel文件,发生编码报错。检索了很多方案,都不能解决。 导致报错的原因是存在违法字符&…...
华为手表应用APP开发:watch系列 GT系列 1.配置调试设备
表开发:GT3(1)配置调试设备 初环境与设备获取手表UUID登录 AppGallery Connect 点击用户与访问初 希望能写一些简单的教程和案例分享给需要的人 鸿蒙可穿戴开发 支持外包开发:xkk9866@yeah.net 环境与设备 系统:window 设备:HUAWEI WATCH 3 Pro 开发工具:DevEco St…...
Vue(十九):ElementUI 扩展实现树形结构表格组件的勾父选子、半勾选、过滤出半勾选节点功能
效果 原理分析 从后端获取数据后,判断当前节点是否勾选,从而判断是否勾选子节点勾选当前节点时,子节点均勾选全勾选与半勾选与不勾选的样式处理全勾选和全取消勾选的逻辑筛选出半勾选的节点定义变量 import {computed, nextTick, reactive, ref} from vue; import {tree} f…...
SpringBoot RestTemplate 设置挡板
项目结构 代码 BaffleConfig /*** Description 记录配置信息* Author wjx* Date 2024/2/1 14:47**/ public interface BaffleConfig {// 是否开启挡板的开关public static boolean SWITCH true;// 文件根目录public static String ROOT_PATH "D:\\TIS\\mock";// …...
arcgis javascript api4.x加载非公开或者私有的arcgis地图服务
需求: 加载arcgis没有公开或者私有的地图服务,同时还想实现加载时不弹出登录窗口 提示: 下述是针对独立的arcgis server,没有portal的应用场景; 如果有portal可以参考链接:https://mp.weixin.qq.com/s/W…...
2024年美赛数学建模A题思路分析 - 资源可用性和性别比例
# 1 赛题 问题A:资源可用性和性别比例 虽然一些动物物种存在于通常的雄性或雌性性别之外,但大多数物种实质上是雄性或雌性。虽然许多物种在出生时的性别比例为1:1,但其他物种的性别比例并不均匀。这被称为适应性性别比例的变化。…...
UDP和TCP的区别和联系
传输层:定义传输数据的协议端口号,以及流控和差错校验。 协议有:TCP、UDP等 UDP和TCP的主要区别包括以下几个方面: 1、连接性与无连接性:TCP是面向连接的传输控制协议,而UDP提供无连接的数据报服务。这意…...
delete、truncate和drop区别
一、从执行速度上来说 drop > truncate >> DELETE 二、从原理上讲 1、DELETE DELETE from TABLE_NAME where xxx1.1、DELETE属于数据库DML操作语言,只删除数据不删除表的结构,会走事务,执行时会触发trigger( 触发器…...
946. 验证栈序列
946. 验证栈序列 描述 : 给定 pushed 和 popped 两个序列,每个序列中的 值都不重复,只有当它们可能是在最初空栈上进行的推入 push 和弹出 pop 操作序列的结果时,返回 true;否则,返回 false 。 题目 : LeetCode 94…...
Linux系统管理和Shell脚本笔试题
1、写一个sed命令,修改/tmp/input.txt文件的内容,要求:(1) 删除所有空行;(2) 在非空行前面加一个"AAA",在行尾加一个"BBB",即将内容为11111的一行改为:AAA11111BBB #写入内…...
docker 搭建 Seafile 集成 onlyoffice
docker-compose一键部署yaml文件 version: "3"services:db:image: mariadb:10.11container_name: seafile-mysqlenvironment:- MYSQL_ROOT_PASSWORDdb_dev # Requested, set the roots password of MySQL service.- MYSQL_LOG_CONSOLEtruevolumes:- /share/ZFS18_D…...
【Spring Boot 3】【JPA】嵌入式对象
【Spring Boot 3】【JPA】嵌入式对象 背景介绍开发环境开发步骤及源码工程目录结构总结背景 软件开发是一门实践性科学,对大多数人来说,学习一种新技术不是一开始就去深究其原理,而是先从做出一个可工作的DEMO入手。但在我个人学习和工作经历中,每次学习新技术总是要花费或…...
STM32控制DS18B20温度传感器获取温度
时间记录:2024/1/28 一、DS18B20温度传感器介绍 (1)测温范围-55℃~125℃,在-10℃到85℃范围内误差为0.4 (2)返回的温度数据为16位二进制数据 (3)STM32和DS18B20通信使用单总线协议…...
服务器常遇的响应状态码
服务器常遇的响应状态码 状态码 500 表示服务器内部错误。 这种状态码意味着服务器在尝试执行请求时遇到了意外情况。在处理这种状态码时,我们需要联系服务器管理员或服务提供商以获取更多信息。 处理方法:联系服务器管理员或服务提供商以获取更多信息…...
云原生业务全流程DevOps配置预研与实践
背景 我在一个二线城市(山东济南),相对与北上广深杭这些IT业发达的城市来说,济南IT业对于业内新技术的接受度是有点慢的,国内很多一线大厂早先几年前就开始实践使用的技术,我们这边也是近两年才开始慢慢兴…...
SouthLeetCode-打卡24年01月第5周
SouthLeetCode-打卡24年01月第5周 // Date : 2024/01/39 ~ 2024/01/31 031.删除链表的倒数第 N 个结点 (1) 题目描述 031#LeetCode.19.#北岸计划2024/01/29 (2) 题解代码 Version1.0 class Solution {public ListNode removeNthFromEnd(ListNode head, int n) {if(head …...
【国产MCU】-CH32V307-通用DMA控制器及使用
通用DMA控制器及使用 文章目录 通用DMA控制器及使用1、通用DMA控制器介绍2、DMA驱动API介绍3、DMA使用实例直接存储器访问控制器(DMA)提供在外设和存储器之间或存储器和存储器之间的高速数据传输方式,无须CPU 干预,数据可以通过DMA 快速地移动,以节省CPU 的资源来做其他操…...
mysql8.0-cnf文件
一、my.cnf 文件 注意:根据自己环境进行参数的调整。 [client] port 3307 socket /data/mysql8.0.35/3307/tmp/mysql.sock[mysqldump] quick max_allowed_packet 64M[mysql] prompt"\u\h: \R:\m:\s [\d]> " no-auto-rehash[mysqld] ###### BASIC…...
小白也能玩转AI翻译:translategemma图文翻译快速入门指南
小白也能玩转AI翻译:translategemma图文翻译快速入门指南 1. 认识translategemma:你的私人翻译助手 translategemma-12b-it是Google基于Gemma 3模型开发的开源翻译模型,它能同时处理文本和图片中的文字翻译。想象一下,你正在国外…...
开源吐槽大会:技术圈的幽默自省
开源项目吐槽大会技术文章大纲主题与目的开源项目吐槽大会旨在通过幽默、犀利的视角,揭示开源生态中的常见问题,促进开发者反思与改进。文章将从技术、社区、维护等角度展开,兼顾娱乐性与建设性。核心内容结构技术层面的经典槽点 依赖地狱&am…...
SSM+JSP洪涝灾情应急物资管理系统源码+论文
代码可以查看文章末尾⬇️联系方式获取,记得注明来意哦~🌹 分享万套开题报告任务书答辩PPT模板 作者完整代码目录供你选择: 《SpringBoot网站项目》1800套 《SSM网站项目》1500套 《小程序项目》1600套 《APP项目》1500套 《Python网站项目》…...
零基础玩转mxbai-embed-large-v1:6大核心功能实战,从向量化到摘要生成
零基础玩转mxbai-embed-large-v1:6大核心功能实战,从向量化到摘要生成 1. 引言:为什么选择mxbai-embed-large-v1? mxbai-embed-large-v1是当前自然语言处理领域的一颗新星,这款多功能句子嵌入模型在MTEB基准测试中表…...
51单片学习ing
现在能够实现LED闪烁了!! 开心 今天学习了让LED闪烁以及LED流水灯,主要是了解了软件延时计算器这个工具 现在可以更灵活的变换LED的变换速度了,如下: 接下来学习到了c语言里模块化的思想,之前学习c的时候…...
Gemma-3-12B-IT大模型微调实战:领域适配指南
Gemma-3-12B-IT大模型微调实战:领域适配指南 1. 微调前的准备工作 微调大模型听起来很高深,其实就像教一个聪明人学习新技能。Gemma-3-12B-IT本身已经懂很多东西了,我们要做的就是让它更擅长某个特定领域。开始之前,你需要准备好…...
LumiPixel Canvas Quest集成Vue.js:打造动态人像画廊管理后台
LumiPixel Canvas Quest集成Vue.js:打造动态人像画廊管理后台 1. 项目背景与需求分析 在数字内容创作领域,AI生成人像正成为设计师和内容创作者的重要工具。传统人工绘制方式耗时费力,而直接使用AI生成工具又缺乏系统化管理。我们团队最近用…...
OpenCV实战:从相机响应函数(CRF)到HDR图像合成的完整流程解析
1. 相机响应函数(CRF)基础解析 第一次听说相机响应函数(CRF)时,我也是一头雾水。简单来说,CRF就是描述相机如何把真实世界的光线强度(L)转换成图像像素值(B)的数学关系。想象一下,你拿着手机对着同一个场景拍三张照片:一张很暗、一…...
Phi-4-mini-reasoning实际作品:15个跨学科逻辑题(数学/哲学/计算机)解答集
Phi-4-mini-reasoning实际作品:15个跨学科逻辑题(数学/哲学/计算机)解答集 1. 模型能力概览 Phi-4-mini-reasoning是一个专注于推理任务的文本生成模型,特别擅长处理需要多步逻辑推导的问题。与通用聊天模型不同,它被…...
TimeGAN实战:用对抗网络生成高保真时间序列数据
1. TimeGAN:当时间序列遇上生成对抗网络 第一次听说TimeGAN这个概念时,我正在处理一批金融交易数据。客户要求我们开发一个高频交易预测模型,但原始数据涉及商业机密,能拿到的样本量只有正常需求的1/10。当时试过传统的数据增强方…...

