在 v-html 中显示和渲染 Vue 组件

Question

所以我将我的帖子的 HTML 存储在我的数据库中（作为下面的示例内容）在我的帖子页面上，您可以在其中查看数据我有一个简单的

<span v-html="content"></span>

我想问一下，当从数据库中获取 Vue 组件作为示例或一般的 v-html 时，如何使 Vue 组件在 HTML 中工作。

如果 v-html 不是我经常在不同来源上阅读的方法，那么这里最好的用例是什么？

 <div v-swiper:mySwiper=""> <div class="swiper-button-prev" slot="button-prev"></div> <div class="swiper-button-next" slot="button-next"></div> <div class="swiper-pagination" slot="pagination"></div> <div class="swiper-wrapper"> <div class="swiper-slide"><img src="v8.jpg"></div> <div class="swiper-slide"><img src="v7.jpg"></div> <div class="swiper-slide"><img src=v6.jpg"></div> </div> <div class="swiper-pagination"></div> </div>

Answer 1

我不会这么早掉毛巾的。 看看https://github.com/alexjoverm/v-runtime-template

这可能对您的用例有用，因为通常担心这些方法对恶意注入的安全性。

但是，从长远来看，我会寻找不同的解决方案，例如在您的所见即所得编辑器中嵌入一些特殊标签，并在呈现内容时用真实组件替换这些标签（可能使用动态组件https://v2.vuejs.org/ v2/guide/components-dynamic-async.html ）。