如何让Vue 3的渲染函数h()输出HTML？
回答 1
浏览 1260
2022-01-12
我正在使用Vue 3的渲染功能，但无法解决如何在模板中渲染HTML的问题。
我已经试过这个了。
h('span', {}, '<strong>Bold</strong>');
但它在页面上输出的是html标签<strong>Bold</strong>，而不是Bold。
有没有人知道如何让render函数渲染HTML？
第一个参数是html（在本例中是span）。
- maembe 2022-01-12
谢谢 @maembe，我明白了，但是，如果我想让它的内容是html格式的，怎么办？
- CUGreen 2022-01-12
1 个回答
#1楼
已采纳
得票数 1
根据h()参数，我认为render函数不能直接在children参数中渲染HTML，你需要转移到另一个render函数，比如说
return h('span', {}, [h('strong', 'Bold')]);
但你可以在道具参数中设置innerHTML，使之成为。
return h('span', {
innerHTML:'<strong>Bold</strong>'
},[]);
innerHTML对我来说是完美的，因为它的值将来自CMS的数据库。
- CUGreen 2022-01-12
@CUGreen 那如何在组件中呈现呢？
- Josué Martínez 2022-06-27
问题是，我有动态对象，它导出的对象能够在我的HTML中呈现，类似于： const components = { button: h('button'), a: h('a' , { ... }) }; return { components }.
- Josué Martínez 2022-06-27