vue slot插槽组件

slot插槽见名知意 就是把想要写的东西做一个容器出来然后写进去

组件写在components文件夹下面，
我的插槽组件名为 slottest.vue.

<templater>
<div>
<div><h1>插槽组件</h1></div>
<slot></slot>
<!-- 
	slot标签就可以在组件引入页面后的标签里面写东西
  如果没有这个slot标签那么在页面引入的组件标签里面写再多的东西都不会显示
  -->
<div>在页面引入的组件标签里面写东西想要改变东西的位置可以使用name属性</div>

<slot name="footer"></slot>

<!-- 使用方法 假设我的组件标签为 slottest
<slottest>
<p   slot="footer"> 这里写东西位置就在组件的 
<slot name="footer"></slot>
这个标签的位置
</p>
</slottest>
 -->
</div>
</templater>

使用组件页面

<template>
  <div>
    <div>slot插槽-----就是使用slot组件在不同的div中插入类容</div>
    <slottest>

     <p>123</p>
     <p slot="footer">123</p> <!--通过slot的name属性来决定它在插件中的位置-->
    </slottest>
  </div>
</template>

<script>
  //引入组件slot 插槽
  import slottest from '../../components/slottest.vue'
  export default {

    data(){
      return{

      }
    },
    components:{
      slottest
      //注册主键
    }

  }
</script>