11-solt插槽

solt插槽（26-solt插槽.html）

定义slot:(目的：内容上：有配置走配置，没配置走默认，顺序：走默认)
引入子组件，如果不定义某个默认的结构或者样式，那么直接写子组件的名称即可
如果要自定义:
　　1.子组件必须为双标签。
　　2.子组件内写上自定义的结构或者样式并且加上slot的属性，而这个属性名要对应默认slot的名字
　　3.在子组件中，包一个slot的元素，可以任意修改，在slot元素上定义一个叫做name的属性，为了好对应操作
例子：

//DOM部份
<div id="app">
  <ppa>      
    <!-- 有配置 。显示的内容会按照默认的顺序显示，但内容会显示配置的内容 -->
    <div slot="content">修身</div> 
    <div slot="footer">修脚</div> 
    <div class="xob" slot="box"></div> 
　</ppa> 
</div>

//script 部份
Vue.component('ppa',{
  //有默认，显示的内容会按照默认的顺序显示，但内容会显示配置的内容。
  template:`
    <div>
      <slot name="box">
        <div class="box" ></div>   
      </slot> 
      <slot name="content">
        <div>中间的内容</div>   
      </slot> 
      <slot name="footer">
        <div>底部的内容</div>   
      </slot> 
    </div>
  `
});
  
new Vue({
  el:'#app'
});