vue插槽用法,vue的插槽有几种方式
至于slot的概念和用法，这是vue的一个难点，需要我们静下心来慢慢研究。下面这篇文章主要介绍vue默认槽的相关信息，有需要的朋友可以参考一下。
目录
槽缺省槽的理解代码片段总结是什么？
什么是插槽
它是提供给父组件的插槽子组件中的占位符。用槽/槽来表示。父组件可以在这个占位符中填充任何模板代码，比如HTML、组件等。填充的内容将替换子组件的插槽/插槽标签。
默认插槽的理解
就是用full标签()在其full标签中写入相应的配置(比如我们需要的功能)。
然后使用默认的槽标签将写入的内容放入这个槽中(这个槽一般存在于子组件中，所以可以将父组件写入的内容赋予子组件)。
关于在全标签中写的配置样式，我们可以在父组件和子组件中都写(因为，1，在父组件中写样式的时候，样式已经渲染好了，然后放到子组件中；2.当样式写入子组件时，将配置放入插槽，插槽所在的子组件有css样式，它将呈现我们的配置)
代码片段
类别. vue
模板
div class=类别
H3{{ title }}分类/h3
！-定义一个缺省槽，那么App.vue中对应组件标签中标签体的内容会放在这个槽中-
插槽/插槽
/div
/模板
脚本
导出默认值{
名称：“类别”，
道具：[title]，
};
/脚本
风格。类别{
背景色：天蓝色；
宽度：200px
高度：300px
}
h3 {
文本对齐：居中；
背景色：橙色；
}
/风格
App.vue
模板
div class=容器
类别标题=美食
图片
src= https://zqcdn . itzjj . cn/static/skin/mfw 0321/static/picture/DJ _ scv . jpg
alt=1
/
/类别
类别标题=游戏:列表数据=游戏
保险商实验所
！-此时因为变量直接在app.vue中，所以可以直接遍历游戏。
遍历之后，使用slot函数将其传递给Category.vue -
li v-for=(g，index) in games :key=index
{{ g }}
/李
/ul/类别
类别标题=电影:列表数据=电影
！-控件可以使视频可播放-
录像
控制
src= http://clips . vorwaerts-gmbh . de/big _ buck _ bunny . MP4
/视频
/类别
/div
/模板
脚本
从导入类别。/组件/类别；
导出默认值{
名称：“应用程序”，
组件：{类别}，
data() {
返回{
食物：[火咕，你的肉，肉丸]，
游戏：[《红色警戒Online》《穿越火线》《舞团》]，
电影：[ 《教父》 ， 《拆弹专家》 ， 《牛逼》 ]，
};
},
};
/脚本
风格。容器{
显示器：flex
justify-content:space-around；
}
视频{
宽度：100%；
}
img {
宽度：100%；
}
/风格
总结
关于vue默认槽的这篇文章到此为止。有关vue默认插槽的更多信息，请搜索我们以前的文章或继续浏览下面的相关文章。希望你以后能支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。