傑森前端

#父組件
	<組件>
		//指定插槽名稱舊寫法
		<template slot="center">
			xxx
		</template>
		//指定插槽名稱新寫法
		<template v-slot:center>
			xxx
		</template>
		//指定插槽名稱新寫法簡寫
		<template #center>
			xxx
		</template>
	</組件>
	
#子組件
	<slot name="center"></slot>

作用域插槽

可以拿到子組件中的值

#父組件
	<組件>
		//作用域插槽舊寫法
		<template scope="data">
			{{data}}
		</template>
		//作用域插槽新寫法
		<template slot-scope="data">
			{{data}}
		</template>
	</組件>
	
#子組件
	<slot :data="data"></slot>

常用的

#父組件
	<組件>
		//作用域與名稱的簡寫寫法，比較方便。
		<template #center="data">
			{{data}}
		</template>
	</組件>
	
#子組件
	<slot name="center" :data="data"></slot>

 

小知識

1. 插槽默認name名稱default
2. this.$slots可以拿到傳下來的插槽名稱與虛擬節點