在 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 ）。