一、Vue组件
1.局部组件
<div id="app">
<website></website>
</div>
<script>
new Vue({
el: '#app',
//局部组件
components: {'website': {template: '<span>自定义局部组件!</span>'}}
})
</script>2.全局组件
<div id="app">
<website></website>
</div>
<script>
//全局组件
Vue.component('website', {
template: '<span>自定义全局组件!</span>'
})
new Vue({
el: '#app'
})
</script>二、Vue组件间传值
<div id="app">
<!-- name为静态值，url为动态值 -->
<website name="木子屋" v-bind:url="url"></website>
</div>
<script>
Vue.component('website', {
props: ['name', 'url'],
template: '<span>{{name}} - {{url}}</span>'
})
new Vue({
el: '#app',
data: {
url: 'www.mzwu.com'
}
})
</script>
评论（0）
暂无评论。