【vue】Do not use built-in or reserved HTML elements as component id: header 报错提示

最新推荐文章于 2023-10-31 10:53:34 发布
原创 最新推荐文章于 2023-10-31 10:53:34 发布 · 1.3k 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文讨论了在前端开发中避免使用HTML内置或保留元素作为组件ID的重要性，并提供了如何正确命名组件ID的建议。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

在这里插入图片描述
错误提示：不要使用内置或保留的HTML元素作为组件ID

header 使用其他名称，重命名组件。
之前是这样在这里插入图片描述
换一个非HTML元素即可在这里插入图片描述

vue 报错 ：[Vue warn]: Do not use built-in or reserved HTML elements as comp
且听风吟的博客
11-26 5585
引入组件后出现了如下报错： 是因为组件的命名和html标签重复导致警告，如下： 解决方案是给 name 换个名字就可以啦，如下： 所以，创建组件的时候要注意组件命名与html标签区分开。 由于模板需要插入到 DOM 中，所以模板中的标签名必须能够被 DOM 正确地解析。 主要有三种情况： 一是完全不合法的标签名，例如 </> ； 二是与 HTML 元素重名会产生不确定的行为，例如使用 input 做组件名不会解析到自定义组件，使用 button 在 Chrome 上正常但在 IE 上不正常
解决vue 引入子组件报错的问题
12-03
Do not use built-in or reserved HTML elements as component id: header 源码： [removed] import header from "./components/header" import aside from "./components/aside" import footer from "./components...
Do not use built-in or reserved HTML elements as component id: header
rj2017211811的博客
02-09 1531
错误:定义了一个header组件但是无法被其他组件引用 原因:因为header为h5的标签，vue中规定：组件的名称不能和h5的标签名称相同 关于vue的书写规范参考vue官网:https://cn.vuejs.org/v2/style-guide/ ...
vue报错 Do not use built-in or reserved HTML elements as component id:header
dongjiong0213的博客
06-23 375
组件，不能和html标签重复 header组件，h5新标签重复 Do not use built-in or reserved HTML elements as component id:header 由于在模板需要插入到 DOM 中，所以模板中的标签名必须能够被 DOM 正确地解析。主要有三种情况： 　　　　一是完全不合法的标签名，例如 </>； 　　　　二...
Vue报错：[Vue warn]: Do not use built-in or reserved HTML elements as component id: header
山海有灵的专栏
10-31 360
Vue warn]: Do not use built-in or reserved HTML elements as component id: header写了一个自定义组件name为header，与HTML内置header命名冲突了。修改自定义组件名为my-header解决。
[Vue warn]: Do not use built-in or reserved HTML elements as component id: header,解决办法
半夏_2021的博客
04-21 1005
[Vue warn]: Do not use built-in or reserved HTML elements as component id: header
permission.js:46 [Vue warn]: Do not use built-in or reserved HTML elements as component id: dialog
最新发布
03-14
要解决Vue警告“Do not use built-in or reserved HTML elements as component id”，需遵循以下步骤： ### 原因分析 Vue禁止使用与HTML标签同名的组件名称（如`<input>`、`<select>`），因为这会与原生HTML元素...
Do not use built-in or reserved HTML elements as component id: nav
05-31
这个警告是由 Vue 产生的，意思是您正在使用内置的或保留的 HTML 元素作为组件 ID。 HTML 中有一些元素被视为“保留元素”，因为它们具有特殊的用途，例如 `<nav>`、`<header>`、`<footer>`、`<main>` 等。在 Vue ...
main.js:32 [Vue warn]: Do not use built-in or reserved HTML elements as component id: main at <Main onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > at <RouterView> at <App>
03-08
好的，我现在需要解决用户提到的Vue组件命名警告问题，具体是关于避免使用内置或保留的HTML元素作为组件ID的警告。首先，我得理解这个问题的原因。Vue.js在注册组件时，组件名称如果与HTML内置标签或保留字冲突，就...
解决vue warn：Do not use built-in or reserved HTML elements as component id: header
weixin_46743083的博客
08-01 1万+
[Vue warn]: 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
weixin_30270561的博客
02-12 1114
一、Vue在引入组件后无法显示组件内容且报错如下： 　　[Vue warn]: Do not use built-in or reserved HTML elements as component id: header 二、原因是vue里面不允许用特殊的单词给一个组件的注册然后在以自定义标签的方式引用会被限制，比如下图的header 三、解决方案 　　在component里面注册...
Do not use built-in or reserved HTML elements as component id: head
信徒博客
05-09 1万+
vue项目在使用组件的时候报了如下错误 Do not use built-in or reserved HTML elements as component id: head 错误代码如下 错误原因 head是特殊关键字，在components里面不能被使用 解决方案 换一个其他的名字如hd就可以了 ...
vue引入组件无法显示且报错[Vue warn]: Do not use built-in or reserved HTML elements as component id: header
热门推荐
涂涂
12-19 3万+
一、Vue在引入组件后无法显示组件内容且报错如下： [Vue warn]: Do not use built-in or reserved HTML elements as component id: header 二、原因是vue里面不允许用特殊的标签来做自定义的标签比如你不能用a来接收一个组件的注册然后在以自定义标签的方式引用会被限制 三、解决方案 在component里面注册组件的时
vue报错：[Vue warn]: Do not use built-in or reserved HTML elements as component id: header
weixin_30300225的博客
04-15 191
报错的信息大致是不要将内置或保留的HTML元素用作组件ID 解决的办法是修改name符合规范或者直接删除组件内的name属性。 转载于:https://www.cnblogs.com/licurry/p/10709677.html...
解决vue-router按需加载component: () => import()报错
总结来说，Vue-router的按需加载通过Vue异步组件和Webpack的Code Splitting实现，当遇到`SyntaxError: Unexpected token`报错时，需要确保Babel配置了`babel-plugin-syntax-dynamic-import`插件。同时，利用Webpack...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值