如何理解vue的slot
插槽(Slot)是Vue提出来的一个概念，正如名字一样，插槽用于决定将所携带的内容，插入到指定的某个位置，从而使模板分块，具有模块化的特质和更大的重用性。插槽的原理和Angular中的ng-transclude十分类似，本篇也是对所学内容做一个梳理。
形式上看，Slot的设计对应了angular中的ng-tranclude属性，即用该方法来确定在何处放置嵌入部分。
1.ng-transclude使用
html内容
{{msg}}
模版内容
Here comes the message.
渲染结果
Here comes the message.
{{msg}}
2.Slot的使用
匿名slot
举个栗子，在Vue中，我们会这么写带slot的组件：
子组件模板
我是子组件的标题
/*这里插入父组件在引用子组件内部的内容*/
父组件模板
我是父组件的标题
这是一些初始内容
这是更多的初始内容
渲染结构
我是父组件的标题
我是子组件的标题
这是一些初始内容
这是更多的初始内容
对比一下，是不是和ng-transclude十分类似?Slot所做的工作，也是把父组件中的“内容”被放入了slot，并将组合后的组件模版返回到父组件。这里slot标签里的内容实际并没有显示，被当作了备用内容(只有在宿主元素为空，没有要插入的内容时才显示)。
更进一步地，Vue给出了具名Slot也作用域插槽这两个比较独特的设计。
具名slot
上面栗子中使用的是匿名slot，即该节点不携带任何其也特征信息。对应的，Vue也提供了具名slot。简单来讲，具名Slot就是会为模板中不同部分指定相应的插入位置。但是当部分内容没有找到对应的插入位置，就会依次插入匿名的slot中，当没有找到匿名slot时，这段内容就会被抛弃掉。
子组件模版
父组件模板
Lack of anonymous slot, this paragraph will not shown.Here comes the footer contentHere comes the header content
渲染结果
Here comes the header content
Here comes the footer content
Lack of anonymous slot, this paragraph will not shown.
