1. Vue 简单插槽

白怀宇

于 2020-06-13 13:07:08 发布

阅读量173

点赞数

分类专栏： Vue2 学习笔记文章标签： vue

本文链接：https://blog.youkuaiyun.com/b342216980/article/details/106730887

版权

Vue2 学习笔记专栏收录该内容

45 篇文章

订阅专栏

Vue 简单插槽

将组件中间的内容添加至组件中的位置，可以插入html代码

<div id="app"> 
    <navigation-link url="http://wwww.baidu.com"> 百度 </navigation-link>    
</div>

Vue.component('navigation-link', {
    props: {
        url: ''
    },
    template:`
        <a v-bind:href="url" class="nav-link">
        	<slot></slot>
        </a>    
    `  
})
app = new Vue({
    el: '#app',
})