资讯专栏INFORMATION COLUMN

vue 2.6.0 具名插槽, 作用域插槽

MorePainMoreGain / 2568人阅读

摘要:后将已废弃的使用特性的语法废除,但是目前还能够使用,链接地址如图实现一个类似,星级点评的组件父组件子组件子组件将绑定再传给父组件的再通过获得传过来的值,官方解释作用域插槽的内部工作原理是将你的插槽内容包括在一个传入单个参数的函数里插槽

vue 2.6.0后将已废弃的使用 slot-scope 特性的语法废除,但是目前还能够使用,
链接地址:https://cn.vuejs.org/v2/guide...
如图实现一个类似,星级点评的组件


父组件:


子组件:


子组件将 star绑定再传给父组件的 v-slot="slotProps",再通过slotProps.star获得传过来的值,

官方解释:
作用域插槽的内部工作原理是将你的插槽内容包括在一个传入单个参数的函数里:

function (slotProps) {
// 插槽内容
}
个人理解为这里是一个对象即{star: value(值)}, slotProps为该对象,
具名插槽:
父组件

子组件:

其中v-slot:#header可以这样简写

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/109259.html

相关文章

  • vue 2.6 插槽更新 v-slot 用法总结

    摘要:在中,我们为具名插槽和作用域插槽引入了一个新的统一的语法即指令。它取代了和这两个目前已被废弃但未被移除且仍在文档中的特性。新语法的由来可查阅。 在 2.6.0 中,我们为具名插槽和作用域插槽引入了一个新的统一的语法 (即 v-slot 指令)。它取代了 slot 和 slot-scope 这两个目前已被废弃但未被移除且仍在文档中的特性。新语法的由来可查阅 RFC。 引vue官方文档之前...

    selfimpr 评论0 收藏0
  • vue 插槽,`slot`和 `slot-scope`已被废弃

    摘要:它取代了和这两个目前已被废弃但未被移除且仍在文档中的特性。例外情况当被提供的内容只有默认插槽时,组件的标签才可以被当作插槽的模板来使用。如下,让后备内容默认内容替换正常情况下的绑定在元素上的特性被称为插槽。 最近忙着写一些组件,关于插槽这一块自己还是用着 slot 和 slot-scope,然后看了一下文档的更新,于是又重新把插槽学习了一篇,下面一段是文档中的说明: 在 2.6.0 中...

    myshell 评论0 收藏0
  • vue 插槽,`slot`和 `slot-scope`已被废弃

    摘要:它取代了和这两个目前已被废弃但未被移除且仍在文档中的特性。例外情况当被提供的内容只有默认插槽时,组件的标签才可以被当作插槽的模板来使用。如下,让后备内容默认内容替换正常情况下的绑定在元素上的特性被称为插槽。 最近忙着写一些组件,关于插槽这一块自己还是用着 slot 和 slot-scope,然后看了一下文档的更新,于是又重新把插槽学习了一篇,下面一段是文档中的说明: 在 2.6.0 中...

    thursday 评论0 收藏0
  • 详解vue组件三大核心概念

    摘要:前言本文主要介绍属性事件和插槽这三个基础概念使用方法及其容易被忽略的一些重要细节。至于如何改变,我们接下去详细介绍单向数据流这个概念出现在组件通信。比如上例中在子组件中修改父组件传递过来的数组从而改变父组件的状态。的一个核心思想是数据驱动。 前言 本文主要介绍属性、事件和插槽这三个vue基础概念、使用方法及其容易被忽略的一些重要细节。如果你阅读别人写的组件,也可以从这三个部分展开,它们...

    rickchen 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<