vue报错： Do not use built-in or reserved HTML elements as component id:title

原创 已于 2022-06-24 09:24:42 修改 · 739 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#vue.js

于 2022-06-24 09:21:13 首次发布
本文讨论了在创建自定义组件时，因将属性命名为HTML内置元素如'title'而导致的报错问题。解决方案是确保组件ID不与HTML保留关键字冲突，以保证组件的正常运行。了解并遵循这一最佳实践，可以防止类似的命名冲突错误，提高代码的稳定性和可维护性。

报错的原因是使用了内置的或保留的HTML元素作为组件id:title

我这里是创建共用组件的过程中，把自定义属性里命名为title，导致报错，只需要在创建组件的时候 避开使用html元素内置或保留的名字就行
在这里插入图片描述

vue2源码分析-vue入口文件global-api分析
qq_42389674的博客
03-06 841
vue 全局api初始化 vue挂载的全局属性: vue.util 公共方法,set 方法 ,del方法, nextTick方法,observable observe方法,options vue的一些选项。初始化方法: extend,extend函数此处用于扩展,initUse 初始化插件,initMixin 初始化混入,initExtend,构造一个vue的子类 ,initAssetRegisters(Vue) 注册或者获取全局组件、指令、过滤器
Vue 08使用v-model实现计算器
mqingo的博客
01-02 756
08使用v-model实现计算器.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>08使用v-model实现计算器</title> <script type="text/javascript&quot
[Vue warn]: Do not use built-in or reserved HTML elements as component id:title
小哈力----一个小前端工程师
11-28 1181
[Vue warn]: Do not use built-in or reserved HTML elements as component id:title 说明 不要使用内置或保留的HTML元素作为组件id:title，就是说自定义组件的时候不能使用 html 标签作为命名
Do not use built-in or reserved HTML elements as component id: title
weixin_34220834的博客
01-08 243
[Vue警告]：不要使用内置或保留的HTML元素作为组件ID：XXXX 我使用Vue.components()注册组件成为全局组件，然后我把所有的对象打印出来（上图的对象） 但是由于我设置的组件是xxx-md这样的形式，所有不会有，这样的引用形式，通过检查，是因为name:title这样的设置出现的警告 那么我们就修改这个name就行啦 ...
[Vue warn]: Do not use built-in or reserved HTML elements as component id:
最新发布
weixin_42220130的博客
10-29 1574
在Vue中，组件的ID应该是唯一的，以确保没有冲突。很可能是一个保留字或者是一个内置的HTML元素名称，所以Vue拒绝了这样的用法。如果你正在使用Vue 2.x版本，确保全局ID的唯一性，如果是在Vue 3.x中，则应该使用一个独一无二的name属性代替ID。更改组件的ID，使用一个独一无二的名称，确保它不是一个内置的HTML元素名称，也不是Vue的保留字。在这个例子中，my-custom-component就是一个不会与内置HTML元素冲突的组件ID。
vue报错：Do not use built-in or reserved HTML elements as component id: table
weixin_37746257的博客
04-08 3107
原因：组件，不能和html标签重复 由于在模板需要插入到 DOM 中，所以模板中的标签名必须能够被 DOM 正确地解析。主要有三种情况： 　　　　一是完全不合法的标签名，例如 </>； 　　　　二是与 HTML 元素重名会产生不确定的行为，例如使用 input 做组件名不会解析到自定义组件，使用 button 在 Chrome 上正常但在 IE 上不正常； 　　　　三是与 Vu...
vue name命名错误 Do not use built-in or reserved HTML elements as component
god_sword_的博客
08-05 3683
在项目中我使用的是header 作为组件名称，但是在前端html中这个是内置组件来的，名称已被占用不能再使用这些名称了。这里指的是components的名称命名不正确。若引用改了还是报错啦，可以查看下vue页面的。把命名修改一下，避免名称冲突就好了。是不是也名称冲突了。
人人都能懂的Vue源码系列(四)—mergeOptions
weixin_33744854的博客
05-28 444
上篇文章中我们讲了resolveConstructorOptions，它的主要功能是解析当前实例构造函数上的options，不太明白的同学们可以看本系列的前几篇文章。在解析完构造函数上的options之后，需要把构造函数上的options和实例化时传入的options进行合并操作，并生成一个新的options。 这个合并操作就是今天要讲的mergeOptions。如果大家不想看枯燥的讲解，可以翻到...
Vue中各个生命周期阶段的源码探究--beforeCreate和created阶段
热门推荐
YKG
11-24 1万+
本文主要探讨一下，Vue的一个大致运行流程，我们知道，它的生命周期包括,beforeCreate,created,beforeMount,mounted,beforeUpdate,updated,beforeDestroy,destroyed。但这里讨论只包含beforeCreate,created,beforeMount,mounted，因为探讨的过程只涉及Vue实例创建，事件生命周期、数据监听...
Vue 品牌列表padStart方法的使用
mqingo的博客
01-04 718
06品牌列表padStart方法的使用.html &lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content="width=device-width, initial-s
bug：[Vue warn]: Do not use built-in or reserved HTML elements as component id: Component
qq_45796592的博客
04-17 1333
[Vue warn]: Do not use built-in or reserved HTML elements as component id: Component报错解决
浏览器控制报告：[Vue warn]: Do not use built-in or reserved HTML elements as component id: text
qq_41769719的博客
04-14 1717
这个这个错误不影响页面正常渲染，但会导致浏览器控制台不干净。 报错： [Vue warn]: Do not use built-in or reserved HTML elements as component id: text 一、原因 vue使用组件的时候 浏览器的控制台一直报告该错误；该错误主要是由于vue的组件name与html元素冲突导致。只要用到这个组件都会报错 二、解决方法 将该方法重新命名，改为特定含义的name名称。就可以成功解决了。 例如: ...
Do not use built-in or reserved HTML elements as component id
liukai6的博客
09-14 1681
这时候注意是不是组件的名称和系统的产生冲突导致的
[Vue warn]: Do not use built-in or reserved HTML elements as component id:G
科技向善
03-03 451
我把一个vue组件命名为G.vue，运行时报错，说明g（G）是Vue中的一个关键字，不能如此命名。 像这样的，在MySQL等数据中，不能将id，index之类的作为字段名是类似的。 ...
Do not use built-in or reserved HTML elements as component id:mask vue报错
weixin_30527323的博客
08-20 639
今天学习了一下vue的组件，但是报了一个错误 Do not use built-in or reserved HTML elements as component id:mask ， 经过查询得知是因为 组件名mask ，不能和html标签重复，mask组件名可能与h5新标签重复，如果写aside,header肯定也会报错的，只要修改组件名就可以了，把mask改为了mas...
Do not use built-in or reserved HTML elements as component id: header
rj2017211811的博客
02-09 1540
错误:定义了一个header组件但是无法被其他组件引用 原因:因为header为h5的标签，vue中规定：组件的名称不能和h5的标签名称相同 关于vue的书写规范参考vue官网:https://cn.vuejs.org/v2/style-guide/ ...
[Vue warn]: Do not use built-in or reserved HTML elements as component id: details
wind_linjie的博客
03-18 3262
报错信息 不要使用内置或保留的HTML元素作为组件id:details 由于在模板需要插入到 DOM 中，所以模板中的标签名必须能够被 DOM 正确地解析。主要有三种情况： 1、标签名需要是完全不合法的标签名，例如 </>； 2、是与 HTML 元素重名会产生不确定的行为，例如使用 input 做组件名不会解析到自定义组件，使用 button 在 Chrome上正常但在 IE 上不正...
vue 出现：Do not use built-in or reserved HTML elements as component id: footer问题
且听风吟的博客
07-05 3795
vue引入自定义组件错误 初学vue阶段，学习container布局时，想自定义Footer组件，引入App.vue之后发生了错误，浏览器报错： 浏览器的[vue warn]错误，一般都是组件渲染出现了问题。 bug修改前源码： 查找资料，发现了原因：vue里面不允许使用 Html已有的标签作为自定义标签 因为模板需要插入到 DOM 中，所以模板中的标签名必须能够被 DOM 正确地解析。主要有...
vue项目报错 [Vue warn]: Do not use built-in or reserved HTML elements as component id: a
weixin_48911985的博客
04-28 852
vue 项目中报Do not use built-in or reserved HTML elements as component id: a在网上搜索说原因是vue里面不允许用特殊的标签来做自定义的标签比如你不能用a来接收一个组件的注册然后在以自定义标签的方式引用会被限制但是项目全局搜索name:"a"都没有搜到命名为a的组件经过排查是因为项目使用vue-property-decorator编写的组件中@Component({})中没有设置name值在本地运行项目时这种文件的name会赋值default
解析.vue文件：使用vue-eslint-parser实现ESLint自定义解析
标题《vue-eslint-parser：.vue文件的ESLint自定义解析器》中涉及的知识点主要包括了前端开发中常用的工具和技术。具体来说，包括以下几个方面： 1. **Vue.js**： Vue.js是一个流行的前端JavaScript框架，用于构建...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值