动态组件的功能好强大呀,感觉以后只要写好模板,什么一天一个落地页不是问题,大家好,给大家介绍一下,这个是我的鼠标,复制粘贴复制粘贴,game over,債见
<html>
<head>
<title></title>
<script type="text/javascript" src="vue.min.js"></script>
</head>
<body>
<div id="example">
<component v-bind:is="currentView" :asdf="items">
<!-- 通过使用保留的 <component> 元素,动态地绑定到它的 is 特性,我们让多个组件可以使用同一个挂载点,并动态切换: -->
<!-- 组件在 vm.currentview 变化时改变! -->
<template slot="hi" scope="color">
<li>{{color.favorite}}</li>
</template>
</component>
</div>
</body>
<script type="text/javascript">
var vm = new Vue({
el: '#example',
data: {
currentView: 'posts',
items:[
{c:"red"},
{c:"pink"},
{c:"green"}
]
},
components: {
home: {
template:'<p>Welcome home!</p>'
},
posts: {
template:'\
<ul>\
<slot name="hi" v-for="color in asdf" :favorite="color.c">\
hello everyone )O(\
</slot>\
</ul>\
',
props:['asdf']
},
archive: { /* ... */ }
}
})
</script>
</html>
没毛病。