使用vue组件的时候,我尝试用2中写法去写,写法如下,第一种方法显示正常,但是为什么用第二种写法的父元素却未显示?求大神解答
var partList = Vue.extend({ template: '
Languary 262016年12月5日
最近做一个嵌在APP中的网页活动,接触到好些新技术(支付宝WAP支付场景,微信WAP支付场景、二维码支付场景,网页唤醒APP)。前面的那位同学,你说什么,你都会啊,那是我项目经验少咯 :)今天刚把网页唤醒APP的功能做好,就来写一写
显示正常,ul标签存在
var list = new Vue({ el: '#part', template: "", components: { "my-list": { template: '
Languary 262016年12月5日
最近做一个嵌在APP中的网页活动,接触到好些新技术(支付宝WAP支付场景,微信WAP支付场景、二维码支付场景,网页唤醒APP)。前面的那位同学,你说什么,你都会啊,那是我项目经验少咯 :)今天刚把网页唤醒APP的功能做好,就来写一写
显示错误,ul标签不存在
这一点确实比较奇怪 -- new Vue({el: '#app'})
等价于 new Vue({}).$mount('#app')
,而文档中提到:
// 创建并挂载到 #app (会替换 #app) new MyComponent().$mount('#app')
注意:“替换”!所以在你的第二个例子中,ul#part
其实被替换成了 <my-list>
也就是一个 <li>
.
而为啥第一个例子正常运行呢?因为第一个例子中你没有指定template
,所以ul#part
的HTML会被当作模版,而此时ul#part
会被保留。如果你非要问为什么会被保留,只能说u大就是这样设计的。。。