搬砖的猿@
2021-04-30 11:34
采纳率: 100%
浏览 100
已采纳

Vue3的JSX语法中怎么使用插槽？

在vue3中使用JSX语法，在render 里 书写 { this.$slots.default } 想要插入一个默认插槽，但发现实现结果与预期不一样，页面上输出了一些函数的字符串形式。大佬们有

  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

7条回答 默认 最新

  • 搬砖的猿@ 2021-04-30 12:01
    已采纳

    目前发现在render中去把this.$slots.default 执行一次即可输出内容，比如： { this.$slots.default() }，然后官网上有详细回复

    https://github.com/vuejs/jsx-next#installation

    已采纳该答案
    评论
    解决 无用
    打赏 举报

  • 注意：自定义组件的根组件必须是另一个组件，不能是原生的html元素，然后跟着Vue官网看就行了

    评论
    解决 无用
    打赏 举报
  • CSDN专家-Time 2021-04-30 11:37

    slot

    https://cn.vuejs.org/v2/guide/components-slots.html

    评论
    解决 无用
    打赏 举报
  • 有问必答小助手 2021-05-06 15:56

    您好，我是有问必答小助手，您的问题已经有小伙伴解答了，您看下是否解决，可以追评进行沟通哦~

    如果有您比较满意的答案 / 帮您提供解决思路的答案，可以点击【采纳】按钮，给回答的小伙伴一些鼓励哦～～

    ps:问答VIP仅需29元，即可享受5次/月 有问必答服务，了解详情>>>https://vip.csdn.net/askvip?utm_source=1146287632

    评论
    解决 无用
    打赏 举报
  • 有问必答小助手 2021-05-07 14:10

    非常感谢您使用有问必答服务，为了后续更快速的帮您解决问题，现诚邀您参与有问必答体验反馈。您的建议将会运用到我们的产品优化中，希望能得到您的支持与协助！

    速戳参与调研>>>https://t.csdnimg.cn/Kf0y

    评论
    解决 无用
    打赏 举报
  • 搬砖的猿@ 2021-05-08 08:48

    可以将slot写成一个键值对的对象，键为slot的名称，值值则为vNODE，然后作为一个props传给目标组件，组件拿到后使用this.$slots[name]?.() 拿到slot

    评论
    解决 无用
    打赏 举报
  • 搬砖的猿@ 2021-05-08 08:49

    说错了，目标组件是通过props.slots去拿到slot

    评论
    解决 无用
    打赏 举报

报告相同问题？

提交

相关推荐 更多相似问题