网站建设资讯

NEWS

网站建设资讯

Vue的slot怎么使用

这篇文章主要讲解了“Vue的slot怎么使用”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“Vue的slot怎么使用”吧!

成都创新互联专业为企业提供忠县网站建设、忠县做网站、忠县网站设计、忠县网站制作等企业网站建设、网页设计与制作、忠县企业网站模板建站服务,10年忠县做网站经验,不只是建网站,更提供有价值的思路和整体网络服务。

单个 Slot

在子组件内使用特殊的元素就可以为这个子组件添加一个 slot (插槽),在父组件模板里,插入在子组件标签内的所有内容将替代子组件的标签及它的内容.示例代码如下:

子组件

父组件

注意:子组件内的备用内容,它的作用域是子组件本身.

具名 Slot

元素指定一个 name 后可以分发多个内容,具名 Slot 可以与单个 Slot 共存,例如下面的示例:

子组件内声明了3个 元素,其中在

内的 没用使用 name 特性,它将作为默认 slot 出现,父组件没有使用 slot 特性的元素与内容都将出现在这里.

如果没有指定默认的匿名 slot, 父组件内多余的内容片段都将被抛弃.

上例最终渲染后的结果为:

       

           

               

标题

           

           

               

正文内容

               

更多的正文内容

           

           

       

   

感谢各位的阅读,以上就是“Vue的slot怎么使用”的内容了,经过本文的学习后,相信大家对Vue的slot怎么使用这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是创新互联,小编将为大家推送更多相关知识点的文章,欢迎关注!


新闻标题:Vue的slot怎么使用
当前链接:http://njwzjz.com/article/poeeid.html