提示：文章寫完後，目錄可以自動生成，如何生成可參考右邊的幫助文件

前言

比如我這裡的有個元件封裝的需求，通過子元件定義好的插槽在父元件插入子元件定義的插槽點選按鈕時傳出當前選中的物件資料

`提示：以下是本篇文章正文內容

一、子元件相關程式碼

關鍵行 slot name=“btn” :item=“item”

<template>
	<view>
		<view v-for="(item, index) in baseList" :key="index">
			<text>{{ item.title }}</text>
			<slot name="btn" :item="item">
		</view>
	</view>
</template>

<script>
export default {
	name: 'base-box',
	props: {
		baseList: {
			type: Array,
			default: () => []
		}
	},
	data() {
		return {};
	}
};
</script> 

二、在父元件中使用

原始寫法

程式碼如下：

<template> 
	<basebox :baselist="baseList">
		<template slot="btn" slot-scope="scope">
			<button  @click="oncheck(scope)">點選</button>
		</template>
	</basebox> 
</template>

<script>
import basebox from '@/components/base-box/index';
export default {
	components: {
		basebox
	},
	data() {
		return {
			baseList: [
				{
					name: 'photo',
					title: '圖片'
				},
				{
					name: 'lock',
					title: '鎖頭'
				},
				{
					name: 'star',
					title: '星星'
				}
			]
		};
	},
	methods: {
		oncheck(e) {
			console.log(e);
		}
	}
};
</script>

2.簡寫

程式碼如下（示例）：

<template> 
	<basebox :baseList="baseList">
		<template #btn="data">
			<button @click="oncheck(data)">點選</button>
		</template>
	</basebox>
</template>

3.oncheck方法獲取到的資料