在
2.6.0引入v-slot指令【缩写为#】
提示：
v-slot can only be used on components or <template>.
即
v-slot只能添加在一个<template>上，这一点和已经废弃的slot特性不同。
在接下来所有的
2.x版本中slot和slot-scope特性仍会被支持，
但已经被官方废弃且不会出现在Vue 3中。
什么是插槽slot?
image
假设上面定义的组件名为
custDemo,下图是调用过程image
说起来，这叫内容分发：Vue 实现了一套内容分发的 API，这套 API 的设计灵感源自 Web Components 规范草案，将 <slot> 元素作为承载分发内容的出口。
什么是作用域插槽slot-scope
image
调用上面定义的组件：这里的
slotProps即对应slot中绑定的各种属性。可以直接写成
slot-scope="{user}"，若slot中绑定了多个属性，如除了user，还有title,则可以写成slot-scope="{user, title}"；调用的时候直接user.name即可。image
为啥要有这个slot-scope呢？
父组件调用子组件的时候，对应的
slot分发的内容可以直接访问子组件中的实例属性（即data中的数据；当然props中的也可以，只是没有必要，props中的父组件就可以直接访问了，不过props中如list列表循环中的每一项也可以绑定到slot中，参看下面的官方ul案例）
v-slot写法
上述的案例改成v-slot指令的写法（v-slot简写为#也可）：
image
有啥区别呢？
-
template处不能用其他标签替换，slot=""时既可以是template，也可以是普通标签。 -
v-slot:default="slotProps"v-slot:stl="slotProps"这里的default也都带着吧；只有匿名的时候可以不带，但是如果用#缩写那必须都要。 -
3.0后原来的slot和slot-scope写法将会被完全废弃。当然如果你的项目中的vue是2.6.0之前的版本，v-slot也不能用。 - 注意：要修改
vue版本的话，对应vue-template-compiler的版本不要忘记修改。
image
官网中有个ul列表用slotProps
个人觉得这个案例比较能说明为啥要用slotProps
插槽 prop 允许我们将插槽转换为可复用的模板，这些模板可以基于输入的 prop 渲染出不同的内容。这在设计封装数据逻辑同时允许父级组件自定义部分布局的可复用组件时是最有用的。
image
image
页面效果如下：
image
render函数中的slot
- 先封装组件
cusNode如下：
image -
render函数中调用组件：
image -
将上面的两个文件放一起截图看下关系：
image - 渲染函数&jsx相关知识点另行总结......
vue实例方法 $slot & $scopedSlots
- 包含
slot插槽的组件
image - 调用组件，没有用
noScope插槽
image
打印结果：
image - 调用组件，一个
noScope,一个default
image
打印结果：
image
注意：从 2.6.0 开始，这个属性有两个变化：
- 作用域插槽函数现在保证返回一个
VNode数组，除非在返回值无效的情况下返回undefined。 - 所有的
$slots现在都会作为函数暴露在$scopedSlots中。如果你在使用渲染函数，不论当前插槽是否带有作用域，我们都推荐始终通过$scopedSlots访问它们。这不仅仅使得在未来添加作用域变得简单，也可以让你最终轻松迁移到所有插槽都是函数的Vue 3。
官网说：
vm.$scopedSlots在使用渲染函数开发一个组件时特别有用
image
