vue中报错Do not use built-in or reserved HTML elements as component id details
原因是定义了一个叫做details的comonent
跟现有的html网页中的标签重合
export default {
name: 'details',
data () {
return {
equityBalance: this.item.equityData,
depositWithdraw: this.item.depositWithdraw,
symbol: 3,
//真实的出金记录
withdrawData: {},
//真实的入金记录
depositData: {}
};
}
}
组件,不能和html标签重复
details组件,h5新标签重复
由于在模板需要插入到 DOM 中,所以模板中的标签名必须能够被 DOM 正确地解析。主要有三种情况:
一是完全不合法的标签名,例如 </>;
二是与 HTML 元素重名会产生不确定的行为,例如使用 input 做组件名不会解析到自定义组件,使用 button 在 Chrome 上正常但在 IE 上不正常;
三是与 Vue 保留的 slot、partial、component 重名,因为会优先以本身的意义解析,从而产生非预期的结果。
解决办法:
办法1: 如果我们采用正确命名,并对应修改上述代码,将details改正,即可消除报错。
办法2: 也可以直接删除name 属性。
站在巨人的肩膀上摘苹果:
https://blog.csdn.net/qq_35393869/article/details/80364951
https://www.cnblogs.com/qingqingzou-143/p/7068514.html
vue中报错Do not use built-in or reserved HTML elements as component id details的更多相关文章
- vue 渲染是出现 Do not use built-in or reserved HTML elements as component id 的警告
情况1.是因为组件命名和引入不一致造成的. 命名组件(nav) export default { name: 'nav', data () { return { } } 引入组件(Navigation ...
- Do not use built-in or reserved HTML elements as component id:mask vue报错
今天学习了一下vue的组件,但是报了一个错误 Do not use built-in or reserved HTML elements as component id:mask , 经过查询得知是因 ...
- vue报错 Do not use built-in or reserved HTML elements as component id:header
组件,不能和html标签重复 header组件,h5新标签重复 Do not use built-in or reserved HTML elements as component id:header ...
- vue报错:[Vue warn]: Do not use built-in or reserved HTML elements as component id: header
报错的信息大致是不要将内置或保留的HTML元素用作组件ID 解决的办法是修改name符合规范或者直接删除组件内的name属性.
- vue Do not use built-in or reserved HTML elements as component id: nav
刚入坑vue 在新建组件的时候出现这个问题,原因是我新建的这个组件name: 'nav' 在vue中好像nav 这样的 有点类似于 “关键字” 不能作为组件的name,按照服务端来说 就是不可以命名关 ...
- Vue中出现Do not use built-in or reserved HTML elements as component id:footer等等vue warn问题
错误示图: 原因:是因为在本地项目对应文件的<script>中,属性name出现了错误的命名方式,导致浏览器控制台报错! 诸如: name: header . . name: menu ...
- [Vue warn]: Do not use built-in or reserved HTML elements as component id: content
错误如下: 报错原因: 不能使用内建标签,组件不能和html标签重复. 解决办法: 把name改成mContent解决.
- [Vue warn]: Do not use built-in or reserved HTML elements as component id: header
因为header在HTML5里面是个原生的标签,所以在开发的时候会提示错误,解决方法:修改components里面左边的header
- vue中报错Props with type Object/Array must use a factory function to return the default value
Invalid default value for prop "value": Props with type Object/Array must use a factory fu ...
随机推荐
- JSTL (标准标签库)
JSTL(标准标签库) 作用: Web程序员能够利用JSTL和EL来开发Web程序,取代传统直接在页面上嵌入Java程序(Scripting)的做法,以提高程序的阅读性.维护性和方便性. 使用方法:J ...
- 解决linux安装软件:/lib/ld-linux.so.2: bad ELF interpreter: 没有那个文件或目录
在linux系统中安装软件:/lib/ld-linux.so.2: bad ELF interpreter怎么解决 常用的安装因为系统软件位数问题,如:64位系统中安装了32位程序了, 是因为64位系 ...
- centos7.2 部署k8s集群
一.背景 二.使用范围 ♦ 测试环境及实验环境 三.安装前说明 ♦ k8s网络基本概念 ♦ 集群规划图 ♦ 软件版本选取 Name Version Description docker-ce 18. ...
- 【WPF学习】第三十四章 资源基础
WPF允许在代码中以及在标记中的各个位置定义资源(和特定的控件.窗口一起定义,或在整个应用程序中定义). 资源具有许多重要的优点,如下所述: 高效.可以通过资源定义对象,并在标记中的多个地方使用.这会 ...
- angular之模块开发一
模块化开发 概述 什么是模块化开发 将软件产品看作为一系列功能模块的组合 通过特定的方式实现软件所需模块的划分.管理.加载 为什么使用模块化开发 https://github.com/seajs/se ...
- CassandraAppender - distributed logging,分布式软件logback-appender
农历年最后一场scala-meetup听刘颖分享专业软件开发经验,大受启发.突然意识到一直以来都没有完全按照任何标准的开发规范做事.诚然,在做技术调研和学习的过程中不会对规范操作有什么严格要求,一旦技 ...
- C语言出现 "initializer element is not constant" 错误的原因
当在全局变量定义一个指针变量,并动态分配内存后,发现竟然编译不过去,并提示 ""initializer element is not constant"": c ...
- 2020牛客寒假算法基础集训营4 -- A : 欧几里得
A:欧几里得 考察点 : 递推, gcd 坑点 : long long 这道题题解说的十分详细,是裴波那契的一种变形,只不过换成 gcd 了. Code: #include <cstdio> ...
- qt creator源码全方面分析(2-5)
目录 Creating Wizards in Code 介绍 相关类 IWizardFactory的设置器和获取器 Creating Wizards in Code 介绍 如果基于模板的自定义向导提供 ...
- linux 下生成随机密码生成器
[root@localhost ~]# yum -y install pwgen [root@localhost ~]# pwgen -ncCyB1 8 1 kei%b3Xa [root@localh ...