创新互联VUE3教程:Vue 3.0 Slot统一
#概览
此更改统一了 3.x 中的普通 slot 和作用域 slot。

清河门ssl适用于网站、小程序/APP、API接口等需要进行数据传输应用场景,ssl证书未来市场广阔!成为成都创新互联的ssl证书销售渠道,可以享受市场价格4-6折优惠!如果有意向欢迎电话联系或者加微信:13518219792(备注:SSL证书合作)期待与您的合作!
以下是变化的变更总结:
this.$slots现在将 slots 作为函数公开- 非兼容:移除
this.$scopedSlots
更多信息,请继续阅读!
#2.x 语法
当使用渲染函数时,即 h,2.x 用于在内容节点上定义 slot data property。
// 2.x 语法
h(LayoutComponent, [
h('div', { slot: 'header' }, this.header),
h('div', { slot: 'content' }, this.content)
])此外,在引用作用域 slot 时,可以使用以下方法引用它们:
// 2.x 语法
this.$scopedSlots.header#3.x 语法
在 3.x 中,插槽被定义为当前节点的子对象:
// 3.x Syntax
h(LayoutComponent, {}, {
header: () => h('div', this.header),
content: () => h('div', this.content)
}) 当你需要以编程方式引用作用域 slot 时,它们现在被统一到 $slots 选项中。
// 2.x 语法
this.$scopedSlots.header
// 3.x 语法
this.$slots.header#迁移策略
大部分更改已经在 2.6 中发布。因此,迁移可以一步到位:
- 在 3.x 中,将所有
this.$scopedSlots替换为this.$slots。
本文名称:创新互联VUE3教程:Vue 3.0 Slot统一
链接分享:http://www.jxjierui.cn/article/dphohhi.html


咨询
建站咨询
