slotsVnode.js 646 B

12345678910111213141516171819202122
  1. export default {
  2. methods: {
  3. slotsVnode() {
  4. const { $scopedSlots } = this;
  5. if (!$scopedSlots) {
  6. return;
  7. }
  8. /**
  9. * 所有的 $slots 现在都会作为函数暴露在 $scopedSlots 中。
  10. * 如果你在使用渲染函数,不论当前插槽是否带有作用域,
  11. * 我们都推荐始终通过 $scopedSlots 访问它们。
  12. * 这不仅仅使得在未来添加作用域变得简单,
  13. * 也可以让你最终轻松迁移到所有插槽都是函数的 Vue 3
  14. */
  15. return Object.keys($scopedSlots).map((key) => (
  16. <template key={key} slot={key}>
  17. {$scopedSlots[key]()}
  18. </template>
  19. ));
  20. },
  21. },
  22. };