vue中的slot

slot可以理解为一个占位符，插槽

子组件

<template>

<div>

　　<slot name="title">标题</slot>

　　<slot name="content">内容</slot>

</div>

</template>

 

<script>

export default {

 　　name:'Child',

}

</script>

 

父组件：

 

<template>

<div>

　　<Child>

　　　　<p slot="title">我是标题</p>

　　　　<span slot="content">我是内容</span>

　　</Child>

</div>

</template>

<script>

import Child from ‘./components/child’

export default {

 　　name:'father',

　　 components:{

　　　　Child

　　},

}

</script>