template or render function not defined.
template or render function not defined.
下午写 Vue $parent 实例时,总是遇到这个问题,不禁让人陷入沉思
Vue,醒醒啊,你怎么了,贴上子组件源代码
<template>
<div>
<child-component1></child-component1>
<child-component2></child-component2>
<button v-on:click="showChildComponentData">显示子组件的数据</button>
</div>
</template>
<script>
export default{
components: {
'child-component1': {
template: '#child-component1',
data: function () {
return {
msg: 'child component 111111'
}
}
},
'child-component2': {
template: '#child-component2',
data: function () {
return {
msg: 'child component 222222'
}
}
}
},
methods: {
showChildComponentData: function () {
for (var i = 0; i < this.$children.length; i++) {
alert(this.$children[i].msg)
}
}
}
}
</script>
这是报错信息:
修改后的代码:
<template>
<div>
<child-component1></child-component1>
<child-component2></child-component2>
<button v-on:click="showChildComponentData">显示子组件的数据</button>
</div>
</template>
<script>
export default{
components: {
'child-component1': {
template: '<p>I am ok</p>',
data: function () {
return {
msg: 'child component 111111'
}
}
},
'child-component2': {
template: '<p>ok</p>',
data: function () {
return {
msg: 'child component 222222'
}
}
}
},
methods: {
showChildComponentData: function () {
for (var i = 0; i < this.$children.length; i++) {
alert(this.$children[i].msg)
}
}
}
}
</script>
这样就好了,原因是 Vue 的构建,运行时构建删除了模板编译的功能,因此无法支持带 template 属性的 Vue 实例选项。
template or render function not defined.的更多相关文章
- template or render function not defined vue 突然报错了,怎么解决
报错图例如下:template or render function not defined vue 突然报错了,怎么解决什么错误呢,就是加载不出来,网上看了一通,是vue版本不对,是vue-comp ...
- Failed to mount component: template or render function not defined.
Failed to mount component: template or render function not defined. vue-loader13.0有一个变更就是默认启用了esModu ...
- "[Vue warn]: Failed to mount component: template or render function not defined"错误的解决
VUE中动态路由出错: vue.esm.js?a026: [Vue warn]: Failed to mount component: template or render function not ...
- [Vue warn]: Failed to mount component: template or render function not defined. 错误解决方法
解决方法import Vue from "vue"; 默认引入的文件是 vue/dist/vue.runtime.common.js.这个可以在node_modules/vue/p ...
- [Vue warn]: Failed to mount component: template or render function not defined.解决方案
命名视图 vue router 里有一个 模式叫做 命名视图 本来一个页面里面只能有一个路由视图 对应 一个组件,现在可以多个路由视图 对应 多个组件. 出错点 点击标签之后,<router-v ...
- [Vue warn]: Failed to mount component: template or render function not defined. found in ---> <XFbwz> at src/views/XFbwz.vue <App> at src/App.vue <Root>
1.引入.vue文件忘记加.vue 2.引入文件内容为空
- [Vue @Component] Control Template Contents with Vue's Render Function
Declaring templates and elements inside of templates works great for most scenarios. Sometimes you n ...
- [AngularJS] ngModelController render function
ModelValue and ViewValue: $viewValue: Actual string value in the view. $modelValue: The value in the ...
- vue实例属性之el,template,render
一.el,template,render属性优先性当Vue选项对象中有render渲染函数时,Vue构造函数将直接使用渲染函数渲染DOM树,当选项对象中没有render渲染函数时,Vue构造函数首先通 ...
随机推荐
- V4L学习
http://blog.csdn.net/wangrunmin/article/details/7764768# http://blog.sina.com.cn/s/blog_a44175a90101 ...
- POJ1458 Common Subsequence —— DP 最长公共子序列(LCS)
题目链接:http://poj.org/problem?id=1458 Common Subsequence Time Limit: 1000MS Memory Limit: 10000K Tot ...
- 调整多个控件的dock的顺序
https://stackoverflow.com/questions/2607508/how-to-control-docking-order-in-winforms Go to View -> ...
- js的location对象
js的location对象 location基础知识 BOM(浏览器对象模型)中最有用的对象之一就是location,它是window对象和document对象的属性.location对象表示载入窗口 ...
- Java 基本类型和对象类型的区别
Java 基本类型和对象类型的区别 基本类型: int long byte float double char boolean short 对象类型: Integer Long Byte Float ...
- HDU 2914 Triangle (Fibnacci 数)
题意:给你一个长度为 n 的木棒,求至少拿掉几根使得剩余的木棒构成不了三角形. 析:为了保证不形成三角形,所以保证两边之和等于最大边是最优,这不就是Fibnacci 数么,由于 n 很小,if-els ...
- bzoj 2618【半平面交模板】
#include<iostream> #include<cstdio> #include<algorithm> #include<cmath> usin ...
- 开源基于asio的网络通信框架asio2,支持TCP,UDP,HTTP,RPC,SSL,跨平台,支持可靠UDP,支持TCP自动拆包,TCP数据报模式等
开源基于asio的网络通信框架asio2,支持TCP,UDP,HTTP,RPC,SSL,跨平台,支持可靠UDP,支持TCP自动拆包,TCP数据报模式等 C++开发网络通信程序时用asio是个不错的选择 ...
- C#后台调用Http外网接口(GET, POST)
1.get方法调用接口获取json文件内容 public void GetFunction() { string serviceAddress = ...
- iOS 切割圆角图片、图片文件格式判断
1.切割圆角图片 // 性能不好,适合圆角图形数量比较少的情况 UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMak ...