vue3 vnode如何使用(再发一次)？

Question

// father
    <LongList :data="data" :maxShow="10">
      <template #item="{ item }">
        <p>{{ item }}</p>
        <p>{{ item }}</p>
      </template>
    </LongList>

// LongList
  const slots = useSlots(); 
  let slotsArr = slots.item({ ... });

我希望通过js 来创建dom 并放置,但将vue 的vnode 转为dom 似乎只能使用 render ;
render 必须有根元素但我不希望有多余的东西 , 如此 slotsArr[0]/[1] 转换要怎么做呢？有解决方法吗？

Answer 1

先说根元素的事，你可以随便创建一个 dom 节点呀。

再说另外一个事，vue3 本身能力上有做提升，允许自定义渲染。如果你只要字符串，你可以直接当成服务端渲染 https://cn.vuejs.org/api/ssr.html#rendertostring

如果你事不知道 template 怎么转化成 render ，vue2 有个 compiler 的方法。vue3 也有类似的东西 https://github.com/vuejs/core/tree/main/packages/compiler-sfc