情况1.是因为组件命名和引入不一致造成的。

  • 命名组件(nav)
export  default {
name: 'nav',
data () {
return { }
}
  • 引入组件(Navigation)
import Mnav from './common/Navigation'

改成一致后可解决该问题。

  • 命名组件(Navigation)
export  default {
name: 'Navigation',
data () {
return { }
}

情况2.两个大写英文单词书写

  • 引入时的命名(TestPage)
 import TestPage from './Details/testPage'
  • 使用时
<template>
<div class="detail">
<testpage></testpage>
</div>
</template>

改成使用时标签 test-page 即可

<template>
<div class="detail">
<test-page></test-page>
</div>
</template>

vue 渲染是出现 Do not use built-in or reserved HTML elements as component id 的警告的更多相关文章

  1. 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 ...

  2. 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 , 经过查询得知是因 ...

  3. vue Do not use built-in or reserved HTML elements as component id: nav

    刚入坑vue 在新建组件的时候出现这个问题,原因是我新建的这个组件name: 'nav' 在vue中好像nav 这样的 有点类似于 “关键字” 不能作为组件的name,按照服务端来说 就是不可以命名关 ...

  4. vue中报错Do not use built-in or reserved HTML elements as component id details

    原因是定义了一个叫做details的comonent 跟现有的html网页中的标签重合 export default { name: 'details', data () { return { equ ...

  5. Vue中出现Do not use built-in or reserved HTML elements as component id:footer等等vue warn问题

    错误示图: 原因:是因为在本地项目对应文件的<script>中,属性name出现了错误的命名方式,导致浏览器控制台报错! 诸如: name: header .  . name: menu  ...

  6. [Vue warn]: Do not use built-in or reserved HTML elements as component id: header

    因为header在HTML5里面是个原生的标签,所以在开发的时候会提示错误,解决方法:修改components里面左边的header

  7. vue报错:[Vue warn]: Do not use built-in or reserved HTML elements as component id: header

    报错的信息大致是不要将内置或保留的HTML元素用作组件ID 解决的办法是修改name符合规范或者直接删除组件内的name属性.

  8. [Vue warn]: Do not use built-in or reserved HTML elements as component id: content

    错误如下: 报错原因: 不能使用内建标签,组件不能和html标签重复. 解决办法: 把name改成mContent解决.

  9. VUE - vue.runtime.esm.js?6e6d:619 [Vue warn]: Do not use built-in or reserved HTML elements as component i

    <script> export default {     name:'header'       //  不要使用内置或保留的HTML元素 , 改为Header或者置或保留的HTML元素 ...

随机推荐

  1. 另一种分页器 不依赖Paginator模块的方法

    """ 分页组件 """ class Pagination(object): def __init__(self, current_page ...

  2. IM学习目录

    1. 浅谈即时通讯 https://www.cnblogs.com/shoshana-kong/p/9724963.html 2. im即时通讯  https://www.cnblogs.com/sh ...

  3. 2-django配置

    一.settings.py配置 1.时区配置 现在看到的界面是英文的,将 LANGUAGE_CODE = 'en-us' 改为 LANGUAGE_CODE = 'zh-Hans '就可以看到如下界面 ...

  4. python-day8(正式学习)

    目录 列表类型内置方法 常用操作+内置方法 优先掌握(***) 需要掌握(**) 存一个值or多个值 有序or无序 可变or不可变 元组类型内置方法 定义 常用操作+内置方法 优先掌握 一个值or多个 ...

  5. [WPF]BringIntoView

    1.在scrollview 中的frameworkelement可以使用 FE.BringIntoView(); 滚动到此控件. 2.该 方法能一个重载 Bottom.BringIntoView(ne ...

  6. sql认识

    DDL – Data Definition Language数据定义语言DML – Data Manipulation Language数据操作语言DCL – Data Control Languag ...

  7. node.js使用express模块创建web服务器应用

    1.安装express模块 在命令行输入 npm install body-parser --save npm install express --save 2.创建app.js文件 /*应用程序入口 ...

  8. Vue中的组件直接的通信是如何实现的

    组件关系可分为父子组件通信.兄弟组件通信 1.父组件传子组件 通过props属性来实现 2.子组件传父组件 子组件用$emit()来触发事件,父组件用$on()来监听子组件的事件 3.兄弟之间的通信 ...

  9. ——HTTP状态码

    200 请求成功,请求所希望的响应头或数据体将随此返回 302 请求的资源现在临时从不同的URI响应请求,由于这样的重定向是临时的,客户端应当继续向原有地址发送以后的请求. 304 如果客户端发送了一 ...

  10. git上传文件夹报错: ! [rejected] master -> master (fetch first) error: failed to push some refs to 'https://github.com/taminachen/rjxm.git' hint: Updates were rejected because the remote contains work

    使用git上传本地文件夹到远程仓库,使用如下命令:git push -u origin master时报错 原因是在GitHub创建仓库时创建了readme文件,但是本地没有这个文件,造成本地目录与远 ...