插槽
1. 默认插槽
父组件中：（即在子组件中插入标签结构）
<ItemClassify title="游戏分类">
<ul>
<li v-for="(g,index) in games" :key="index">{
{g}}</li>
</ul>
</ItemClassify>
子组件中：
<!-- 定义一个插槽 -->
<slot>当使用者在组件中没有插入结构，我会出现</slot>
2. 具名插槽（有多个插槽时，可以根据插槽名将标签放到指定的位置）
父组件中：
<ItemClassify title="美食分类">
<img slot="center" src="http://www.baidu.com">
<a slot="footer" href="http://www.baidu.com">更多美食</a>
</ItemClassify>
子组件中：
<slot name="center">当使用者没有传递任何结构，我会出现1</slot>
<slot name="footer">当使用者没有传递任何结构，我会出现2</slot>
3. 作用域插槽（可实现子组件给父组件传递数据）
父组件中：
<ItemClassify title="美食分类">
// data只在template中起作用（注意：使用作用域插槽，必须使用template）
// 用scoped对象接收传过来的数据,scoped={food:["火锅","烧烤","小龙虾","牛排"]}
<template #content="{
{food}}">
<ul>
<li v-for="(f,index) in food" :key="index">{
{f}}</li>
</ul>
</template></ItemClassify>
子组件中：
<h3>{
{title}}</h3>
<slot :food="food" msg="我是哈哈" name="content">
当使用者没有传递任何结构，我会出现1
</slot>
data() {
return {
food:["火锅","烧烤","小龙虾","牛排"],
}
},