slot在vue中的使用总结slot是Vue中的插槽，首先它是使用在 子组件 中的
Vue的slot插槽，简单理解就是，在子组件内占坑，在父组件里填坑。
slot一般都是子组件定义了主体部分，父组件引入，然后父组件根据需求不同需要向里面添加不同的内容
1 .普通slot插槽父组件
请记住引入子部件，在使用之前注册components。)
模板！ ---父组件----divslottest/slottest/div/templatescriptimportslottestfrom './slottest ' export default { data ()
模板！ ---子组件-- div子组件/div/template http://www.Sina.com /
模板病毒！ -父组件-- slotTest这是在子组件没有slot插槽时定义的文本/slotTest /div/template
子组件
模板！ ---子组件-- div子组件slot/slot /div/template此时将出现以前添加到父组件的词
2 .命名插槽这时，我们向slotTest /slotTest无论添加什么内容，浏览器中都不会识别，比如下面这个例子
接着我们向子组件中添加slot插槽
具名插槽的作用是，一个萝卜一个坑，可以将父组件中的内容插入指定的子组件位置中
具名插槽的使用语法
1 . 子组件定义slot时，在标签上加上name='xxx'属性
2 . 父组件将想插入的部分最外部的div上加上slot="xxx"属性
模板病毒！ -父组件-- slotTest div slot='header '从父组件传递的头部内容/div div slot='body '父体内容/div div slot='footer '父级
模板！ ----子组件-- div子组件div------ -页面的开头------/divslotname=' header '/slot div---- -页
作用域插槽slot-scope 如
根据vue公式：
父程序集模板中的所有内容都将在父范围内进行编译。
子部件模板中的所有内容都在子级范围内进行编译。
举个例子：
为父组件和子组件都定义name属性
父组件name:'xsdqj '
子组件name:'axdkf '
然后，父组件使用子组件，并使用子组件的插槽将name变量插入子组件中。 在父程序集中调用此name的值时，将使用父程序集的name:'xsdqj '。 这就是作用域限制
slottest { { name }/slottest 3358 www.Sina.com /
举个例子：
父组件
模板！ -父组件--- divslottesttemplateslot-scope=' fromchildlist ' { { fromchildlist }/template/slottest/div/template /script 子组件
模板！ ---子组件--- div slot : child list=' list '/slot/div/templatescriptexportdefault { data () } return ) list 3360 /script 效果
slot-scope将接收到的内容转换为对象的形式。 其中slot-scope接收参数并将其命名为fromChildList。
试着在这里打印参数吧
所以我们如果想使用这个数据中的某个数据的话，就写下来
现在您可以以{ { fromchildlist.child list [0].name } }的形式获取name=xsdqj