插槽语法有版本新旧，建议大家看新版本的语法，不要看旧的语法，避免在语法的新旧上有混淆。
    以下正文部分代码都使用新版语法进行演示。

    首先是匿名插槽(Default slot)和具名插槽(Named slots)。

    这里补充我来定义两个名词，方便后文说明。
    1、分发处 - 分发处留空,等待内容填入。
    2、使用处 - 在使用处放置text / html，使用处的内容会填充到分发处。

    匿名插槽(Default slot)

    若只需要一个分发处，这个时候可以用匿名插槽。
    匿名插槽，就是默认插槽，使用处的内容都会放置在这个默认插槽的位置。

    那么可以直接在模板内(Panel.vue中)添加一个标签（ 标签是分发的入口）。
    ↓ Panel.vue

    1. <template id='panel'>
    2.     <div class="panel">
    3.         <div class="title">
    4.             标题
    5.         </div>
    6.         <div class="content">
    7.             <slot></slot>  (匿名插槽，分发处)
    8.         </div>
    9.         <div class="footer">
    10.             更多信息
    11.         </div>
    12.     </div>
    13. </template>

    这样即可。

    使用时，在组件标签内( ..这里.. )中直接输入需要插入的内容。

    1. <div id="app">
    2.     <Panel>
    3.         hello slot  (这里是使用处)
    4.     </Panel>
    5. </div>

    hello slot就会出现在上面分发处的位置。
    注意： 标签在html中不存在。

    具名插槽(Named slots)

    如果有多个分发处(要留出多个位置来放置内容)，这时就要区分各个分发处的名称(给插槽加个名字)，这时候就需要具名插槽了。

    具体做法是可以在模板内(Panel.vue中)加入solt标签 并给它一个name属性。
    ↓ Panel.vue

    1. <template id='panel'>
    2.     <div class="panel">
    3.         <div class="title">
    4.             <slot name='s1'></slot>
    5.         </div>
    6.         <div class="content">
    7.             <slot name='s2'></slot>
    8.         </div>
    9.         <div class="footer">
    10.             <slot name='s3'>我是默认值</slot>  // 分发处的默认值
    11.         </div>
    12.     </div>
    13. </template>

    使用时，在组件标签内( ) 中需要使用插槽的位置放入
    。

    注意：
    这一要求和插槽旧语法中的slot属性不同。
    slot属性所在的标签可以是