Vue 3 - 如何从函数 return html？

Question

我正在尝试在 vue 3 中使用渲染函数，由于某些原因我不能 return 我的 JSX 直接在 return () => [] 中，但我需要 return 它从一个函数内部，我想知道这是否可能。

这是我正在尝试做的事情：

const testreturn = () => {
    return h('div', { id: 'foo', innerHTML: 'hello world' }, [])
}

return () => [
    testreturn
]

如果我尝试这样做，我不会在模板中看到 'hello world'，而是会在屏幕上看到函数 testreturn。

相反，如果我尝试这样做：

return () => [
    h('div', { id: 'foo', innerHTML: 'hello world' }, [])
]

我会在我的模板中看到 div。有什么方法可以完成我在第一种情况下尝试做的事情吗？

Answer 1

这样调用函数还不够吗？

return () => [
    testreturn()
]

这最终与将 h(...) 直接包含在 return 数组中是一样的。 Vue 在模板中使用时不会执行函数。

Vue 3 - how to return html from function?