Vue入门之旅:一报错 Unknown ... make sure to provide the "name" option及error compiling template
报错一: Unknown custom element: <custom-select> - did you register the component correctly? For recursive components, make sure to provide the "name" option
代码:
html
<custom-select v-bind:list="list2"></custom-select>
js
new Vue({
el: "#app",
data:{
list1: [{"name":"beijing"}, {"name" : "hangzhou" }],
list2: ["2017-1-1", "2017-3-3"]
}
});
//<li class="match-list-li">'+value.name+'</li>
Vue.component("custom-select", {
data: function(){
return {
selectShow : false,
val: ""
};
},
props: ["list"],
template: `
<input type="text" class="form-control" placeholder='press "enter" to match the Employee'
@click="selectShow = !selectShow"
:value="val"> <match-list v-show="selectShow"
:list="list"
v-on:received="changeValueHandler"
></match-list> `,
methods : {
//v-on:received 订阅事件
changeValueHandler(value){
this.val = value; }
}
});
//child
Vue.component("match-list", {
props: ["list"],
template: `
<ul class="repo-admin-match">
<li class="match-list-li" v-for="item of list" @click="changeValueHandler(item)">{{item}}</li>
</ul>
`,
methods : {
changeValueHandler : function(name){
//在子组件中有交互
//告知父级 改变val 需发出一个自定义事件
this.$emit("received", name);
}
}
});
报错原因:
先新建了Vue(new Vue),然后注册组件(Vue.component) 。把顺序颠倒一下即可解决
------------------------------------
报错2:error compiling template
这个一般是写的不符合规范,不能被编译
--Component template should contain exactly one root element. If you are using v-if on multiple elements, use v-else-if to chain them instead.大意应该是Component template应该包含一个确切存在的根元素
所以 我用<section class="wrap"></wrap>包裹起来
Vue入门之旅:一报错 Unknown ... make sure to provide the "name" option及error compiling template的更多相关文章
- scp使用加密算法报错unknown cipher type
为了提高scp的传输速度指定了scp的加密算法为arcfour $ scp -c arcfour localFile userName@remoteIP:remoteFile 得到报错unknown ...
- vue使用v-for时vscode报错 Elements in iteration expect to have 'v-bind:key' directives
vue使用v-for时vscode报错 Elements in iteration expect to have 'v-bind:key' directives Vue 2.2.0+的版本里,当在组件 ...
- jmeter------reponse报错”Unknown column 'XXXXX' in 'where clause'“
一.问题描述 jmeter添加了与数据库mysql的连接,编写完JDBC Request之后,运行提示报错”Unknown column 'be7f5b6e750bb6becf855386338644 ...
- springboot项目POM文件第一行报错 Unknown Error
改成 war 不错了,但是打包麻烦 pom 文件报错 UnKnown Error第一次碰到这个问题,花了几个小时才解决,除了UnKnown 没有任何提示.网上搜的大部分情况都不是我遇到的. 还是没有解 ...
- 使用spring boot 2.1.8生成的maven项目pom.xml第一行报错unknown error
问题:eclipse neon4.6.3新建springboot项目时pom.xml报错unknown error 原因: spring boot 2.1.8更新了maven插件,eclipse不兼容 ...
- vuex2 mapActions 报错 `unknown action type: xxxx`
export const setBreadCrumb = ({ dispatch }, data) => { dispatch('SET_BREADCRUMB', data) } 当调用的时候报 ...
- 解决centos7下 selenium报错--unknown error: DevToolsActivePort file doesn't exist
解决centos7下 selenium报错--unknown error: DevToolsActivePort file doesn't exist 早上在linux下用selenium启动Chro ...
- springboot项目的maven的pom.xml文件第一行报错 Unknown Error
springboot项目的maven的pom.xml文件第一行报错 Unknown Error https://blog.csdn.net/mini_jike/article/details/9239 ...
- idea使用Vue的v-bind,v-on报错
参考解决在WebStorm中使用Vue的v-bind,v-on报错 File-->Settings-->Editor-->Inspections-->XML 把 Unbound ...
随机推荐
- Win7各个版本之间的区别
Windows7包含6个版本,分别为Windows7 Starter(初级版).Windows7 Home Basic(家庭普通版).Windows7 Home Premium(家庭高级版).Wind ...
- MVC :“已添加了具有相同键的项”
最近将一个项目从ASP.NET MVC 3升级至刚刚发布的ASP.NET MVC 5.1,升级后发现一个ajax请求出现了500错误,日志中记录的详细异常信息如下: System.ArgumentEx ...
- 【征文】Hadoop十周年特别策划——我与Hadoop不得不说的故事
2016年是Hadoop的十周年生日,在今年,CSDN将以技术和实战为主题与大家共同为Hadoop庆生.其主要内容包含Hadoop专业词典.系列视频技术解析.Hadoop行业实践.线上问答.线下沙龙. ...
- Centos下源码安装git
1.centos下git版本太久了,才1.8几,而官方更新的还是很活跃的,于是我就想源码安装一个新版本. 2.首先到: https://github.com/git/git/releases 下载最新 ...
- APK反编译之一:基础知识
作者:lpohvbe | http://blog.csdn.net/lpohvbe/article/details/7981386 这部分涉及的内容比较多,我会尽量从最基础开始说起,但需要读者一定的a ...
- JS高程3:Ajax与Comet-进度事件、跨源资源共享
有以下 6 个进度事件 loadstart:在接收到响应数据的第一个字节时触发. progress:在接收响应期间持续不断地触发. error:在请求发生错误时触发. abort:在因 ...
- Linux编程学习路线
参考这篇博客 一本书一本书的啃吧,再多撸点项目
- CSS学习笔记(1)--浮动
总结:浮动只能在脱离文档流的当前位置向上浮动,不能像定位一样到处乱跑. 清除浮动,设置一个类.clear{clear:both;} 1.没有浮动,都独占一行: <!DOCTYPE html> ...
- PHP文件包含
今天突然发现这个东西有好多奇怪的东西,特别写一下记一下 测试用的1.txt及phpinfo.php内容都是phpinfo() 截断: 好多.和好多./截断:这里不测试了,摘自代码审计一书,5.2可用, ...
- Excel函数sumproduct应用案例-多条件求和
作者:iamlaosong 越来越认为sumproduct这个函数实用,过去用sum组函数.改起来复制起来都麻烦,sumif在条件多的时候也认为不方便. 如今改用sumproduct函数,就简单多了. ...