vue 渲染是出现 Do not use built-in or reserved HTML elements as component id 的警告

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

  • 命名组件(nav)
export  default {
  name: ‘nav‘,
  data () {
    return {

    }
  }
  • 引入组件(Navigation)
import Mnav from ‘./common/Navigation‘

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

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

    }
  }

原文地址:https://www.cnblogs.com/zhourongcode/p/9552685.html

时间: 2024-07-31 20:33:48

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

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

刚入坑vue 在新建组建的时候出现这个问题,原因是我新建的这个组建name: 'nav' 在vue中好像nav 这样的 有点类似于 "关键字" 不能作为组建的name,按照服务端来说 就是不可以命名关键字 为你的属性名一样的意思 所以在vue中 比如 nav ,header,footer 不可以作为组建的name 否则会出现这个问题. <script> export default { name: 'mynav',//不可命名为nav header footer 等 dat

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: {} }; } }

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

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

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元素之外的名称就好了 } </script> 原文地址:https://www.cnblogs.com/500m/p/11780472.html

vue渲染数据后与owlCarousel轮播插件冲突,失效

主要原因:dom解析准备完成后,开始执行$(document).ready(); 而vue是在window.onload(页面加载完后才执行):所以会导致owlCarousel插件失效. 解决方案:数据渲染后,更新dom:再调用插件.(vue的 this.$nextTick可以更新dom) 1.引入owlCarousel插件,vue,jq (function ($) { new Vue({ el: '#owl-demo1', data:{ aboutData:[], getRouteUrl: '

vue渲染过程的{{xxx}}显示

这是由于浏览器的渲染机制导致的,浏览器是从头到尾  如果你的js引用在底部,那么浏览器会先加载dom此时,你用于渲染的{{}}识别符,因为还没读到该识别符对应的js文件,所以会被解析为字符串而显示在页面中,我们可以用过自定义属性v-cloak解决, 实例对象对应标签中加入 v-cloak: <div id="wrap" v-cloak> 然后在css中给定义属性选择器 [v-cloak]{ display:none } vue实例创建完成后会把v-cloak去掉,在没创建实

vue渲染数据模拟

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="app-6"> <div v-for="item in msg" style="borde

Vue:渲染、指令、事件、组件、Props、Slots

如果要我用一句话描述使用 Vue 的经历,我可能会说“它如此合乎常理”或者“它提供给我需要的工具,而且没有妨碍我的工作”.每当学习 Vue 的时候,我都很高兴,因为很有意义,而且很优雅. 以上是我对 Vue 的介绍.在我第一次学习 Vue 的时候,我就想要这样的文章 我喜欢 Vue 的一点是它吸取了其它框架的优秀之处,并有条不紊的将它们组合在一起. 具有响应式组件化的虚拟 DOM 只提供视图层, props 和 类 Redux 状态管理与 React 类似. 条件渲染和服务与 Angular 类

Vue:渲染、指令、事件、组件、Props

如果要我用一句话描述使用 Vue 的经历,我可能会说"它如此合乎常理"或者"它提供给我需要的工具,而且没有妨碍我的工作".每当学习 Vue 的时候,我都很高兴,因为很有意义,而且很优雅. 以上是我对 Vue 的介绍.在我第一次学习 Vue 的时候,我就想要这样的文章 我喜欢 Vue 的一点是它吸取了其它框架的优秀之处,并有条不紊的将它们组合在一起. 具有响应式组件化的虚拟 DOM 只提供视图层, props 和 类 Redux 状态管理与 React 类似. 条件渲