vue插槽详解

插槽分为以下三种

1、默认插槽
2、具名插槽
3、作用域插槽

一 默认插槽

<div id="app">
    <child-component>你好</child-component>
</div>
<script>
   Vue.component('child-component',{
   
        template:`
            <div>
            Hello,World!
            <slot></slot>
            </div>
        `
    })
    let vm = new Vue({
   
        el:'#app',
        data:{
   
        }
    })
</script>

二 具名插槽

具名插槽其实就是在父组件中添加一个 slot=‘自定义名字’ 的属性， 然后在子组件中的 里面添加 name=‘自定义名字’ 即可； 如果父组件中有一