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

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

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

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

组件,不能和html标签重复 header组件,h5新标签重复 Do not use built-in or reserved HTML elements as component id:header 由于在模板需要插入到 DOM 中,所以模板中的标签名必须能够被 DOM 正确地解析.主要有三种情况: 一是完全不合法的标签名,例如 </>: 二是与 HTML 元素重名会产生不确定的行为,例如使用 input 做组件名不会解析到自定义组件,使用 button 在 Chrome 上正常但在 IE…

今天学习了一下vue的组件,但是报了一个错误 Do not use built-in or reserved HTML elements as component id:mask , 经过查询得知是因为 组件名mask ,不能和html标签重复,mask组件名可能与h5新标签重复,如果写aside,header肯定也会报错的,只要修改组件名就可以了,把mask改为了maskdemo 由于在模板需要插入到 DOM 中,所以模板中的标签名必须能够被 DOM 正确地解析.主要有三种情况: 一是完全不合…

原因是定义了一个叫做details的comonent 跟现有的html网页中的标签重合 export default { name: 'details', data () { return { equityBalance: this.item.equityData, depositWithdraw: this.item.depositWithdraw, symbol: 3, //真实的出金记录 withdrawData: {}, //真实的入金记录 depositData: {} }; } }…

错误示图: 原因:是因为在本地项目对应文件的<script>中,属性name出现了错误的命名方式,导致浏览器控制台报错! 诸如: name: header .  . name: menu , 等等都属于错误的命名方式等  错误代码命名如下: 解决办法: 办法1: 如果我们采用正确命名,并对应修改上述代码,即可消除报错. 办法2: 也可以直接删除name 属性.…

情况1.是因为组件命名和引入不一致造成的. 命名组件(nav) export default { name: 'nav', data () { return { } } 引入组件(Navigation) import Mnav from './common/Navigation' 改成一致后可解决该问题. 命名组件(Navigation) export default { name: 'Navigation', data () { return { } } 情况2.两个大写英文单词书写 引入时的…

<script> export default {     name:'header'       //  不要使用内置或保留的HTML元素 , 改为Header或者置或保留的HTML元素之外的名称就好了 } </script>…

刚刚在搭建项目时发现控制台报错 查找发现是因为组件名称所致,也就是当我们起名一个header.vue的组件时,我们安装的vue插件会自动把name设置为default 这就造成了错误 把header修改为headerNav就ok了!!当然你可以修改为任何你喜欢的名字,前提是不冲突…

[Vue warn]: You may have an infinite update loop in a component render function 这个问题很奇怪,之前从来没有遇到过.如果是我自己主导的项目,倒也好办,慢慢 debug 就是:偏偏在公司的项目里遇到这个问题,而公司项目的体系结构很复杂,我还没完全掌握.更恼火的是,因为体系复杂,debug 也非常困难,再加上尚无测试框架,这个难搞啊…… 好死不死的,当时是下午3.4点钟,正好到了肚饿的时刻,结果又落入低血糖状态,真是屋漏…

参考: https://blog.csdn.net/jiangyu1013/article/details/85676292 解决:除了import组件外,还要在components中添加 <template> <div> <div> <slide-img :imgsList="imgsList"></slide-img> </div> </div> </template> <scri…

在泰康保险公众号项目中有个问题是用户选择select中的option,要把对应的id给后台以便后台工作作出相应的效果,我是这样的 <select v-model="selectcomunity" @change="selectnet" class="selectcommuity"> <option value="">请选择</option> <option v-for="(i…

[Vue warn]: Do not use built-in or reserved HTML elements as component id: MenuItem [Vue warn]: Do not use built-in or reserved HTML elements as component id: Menu 对于这种警告,因为MenuItem和Menu在HTML5里面是个DOM对象,所以不能使用, 其实报错也不要紧,自定义的组件换个名字,不要和HTML5里的语义化标签元素重名就…

1. import Layout from '@/views/layout/Layout'; export default [ { // 配置路由,当路径为'/activePublic',使用组件activePublic path: '/activeManage', component: resolve => require(['@/views/activeManage/index.vue'], resolve), }, { // 配置路由,当路径为'/activePublic',使用组件act…

缺少style-loader 或者 stylus-loader 等问题 在文件[package.json]分支:[devDependencies]添加 版本号: "stylus": "^0.54.5", "stylus-loader": "^3.0.1", 如果不知道版本号上github,搜索“stylus-loader”     在控制台 重新安装依赖.再运行项目 npm installnpm run dev 有postcs…

登录注册模态框 注: [Vue warn]: Do not use built-in or reserved HTML elements as component id: diaLog 原因:diaLog 组件名 与 HTML元素名称 重复,将 组件名 改为 diaLoger 即可. 1.封装 可复用 DiaLog 组件 DiaLog.vue <template> <el-dialog title="提示" :visible.sync="dialogVisi…

如有不正,请指正! 目录 1.组件化 2.注册组件 a.创建组件构造器 b.注册组件: c.使用组件 3.组件不能访问vue实例上的数据 4.全局组件与局部组件 5.v-model语法糖 组件通信 6.计算属性原理: 依赖其他 计算 返回结果 7.路由参数 a./routerPath/{id}: 页面刷新 不会丢失 b.query  :会显示在url后面 url?id=xx   刷新不会丢失 c.pamars: 页面刷新 会丢失 8.环境变量配置:全局开发或生产 环境变量的定义与使用 a. b.…

遇到很多问题一一道来. 1.vue报错 Do not use built-in or reserved HTML elements as component id:header 组件,不能和html标签重复 header组件,h5新标签重复 由于在模板需要插入到 DOM 中,所以模板中的标签名必须能够被 DOM 正确地解析.主要有三种情况: 一是完全不合法的标签名,例如 </>: 二是与 HTML 元素重名会产生不确定的行为,例如使用 input 做组件名不会解析到自定义组件,使用 butto…

vue源码业余时间差不多看了一年,以前在网上找帖子,发现很多帖子很零散,都是一部分一部分说,断章的很多,所以自己下定决定一行行看,经过自己坚持与努力,现在基本看完了,差ddf那部分,因为考虑到自己要换工作了,所以暂缓下来先,ddf那块后期我会补上去.这个vue源码逐行分析,我基本每一行都打上注释,加上整个框架的流程思维导图,基本上是小白也能看懂的vue源码了. 说的非常的详细,里面的源码注释,有些是参考网上帖子的,有些是自己多年开发vue经验而猜测的,有些是自己跑上下文程序知道的,本人水平可能有…

/* @flow */ import Vue from '../instance/index' import config from '../config' import { warn } from './debug' import { set } from '../observer/index' import { extend, isPlainObject, hasOwn, camelize, capitalize, isBuiltInTag } from 'shared/util' /**…

_ 阅读目录 一. 什么是Vue组件? 如何注册组件? 1.1 全局注册组件 1.2 局部注册组件 二:组件之间数据如何传递的呢? 1) props 2) $emit 3) 使用$ref实现通信 4) $attrs 和 $listeners 及 inheritAttrs 5) 理解 provide 和 inject 用法 6) 理解使用bus总线 三:在vue源码中注册组件是如何实现的呢? 在Vue中,组件是一个很强大的功能,组件可以扩展HTML元素,封装可重用的代码.比如在页面当中的某一个部分…

本节将看下初始化中的$options: Vue.prototype._init = function (options?: Object) { const vm: Component = this // a uid vm._uid = uid++ // a flag to avoid this being observed vm._isVue = true // merge options if (options && options._isComponent) { // optimize…

转载:https://segmentfault.com/a/1190000016409329 Vue.js 最核心的功能就是组件(Component),从组件的构建.注册到组件间通信,Vue .x 提供了更多方式,让我们更灵活地使用组件来实现不同需求. 一.构建组件 1.1 组件基础 一个组件由 template.data.computed.methods等选项组成.需要注意: template 的 DOM 结构必须有根元素 data 必须是函数,数据通过 return 返回出去 // 示例:定…

Vue.js 最核心的功能就是组件(Component),从组件的构建.注册到组件间通信,Vue 2.x 提供了更多方式,让我们更灵活地使用组件来实现不同需求. 一.构建组件 1.1 组件基础 一个组件由 template.data.computed.methods等选项组成.需要注意: template 的 DOM 结构必须有根元素 data 必须是函数,数据通过 return 返回出去 // 示例:定义一个组件 MyComponent var MyComponent = {{ data: f…

一.Error compiling template: Component template requires a root element, rather than just text. 这个错误意思是,每一个组件中的模板必须含有根元素,不能直接写文本 二.Do not use built-in or reserved HTML elements as component id: div 不用把html元素当做组件的名称去使用 三.Unknown custom element: <as> -…

  Vue本质是上来说是一个函数,在其通过new关键字构造调用时,会完成一系列初始化过程.通过Vue框架进行开发,基本上是通过向Vue函数中传入不同的参数选项来完成的.参数选项往往需要加以合并,主要有两种情况: 1.Vue函数本身拥有一些静态属性,在实例化时开发者会传入同名的属性. 2.在使用继承的方式使用Vue时,需要将父类和子类上同名属性加以合并.   Vue函数定义在 /src/core/instance/index.js中. function Vue (options) { if (pr…

vuex- action   1.当点发送过快,页面中渲染的内容与state中的数据不一致,vuex里面的state变得慢,且不持续更新 2.action中是可以做到页面中state中数据保持一致 责编:menVScode 2017-12-16 22:39 阅读(970) 如果点击按钮不是直接改变store中的状态,而是完成其他操作后再来改变,这时候会出现一个问题. /store/index.js import Vue from 'vue' import Vuex from 'vuex' Vue…

本片文章我将会记录使用vue-cli 以及一些相关插件遇见的问题和解决方案,另外本文章将会持续更新,本着互联网分享精神,希望我所记录的日常能对大家有所帮助. 1.在img和html文件处于同级阶段,img路径找不到图片. 解决方案:在路径前面加'./'即可. 注意:图片和文件夹属于同级别.(还是给你们上个图吧.) <img src="./search-icon.png" alt=""> 2.Do not use built-in or reserved…