有沒有辦法從具有輸入的組件轉換為原始html？

Question

我在Vue component-z中有一個組件。

我需要傳遞某些參數，所以當我在我的Vue的html中使用它時，我做如下：

<component-z id="component" data1="data" data2="moreData"></component-z>

我需要從中取出html並將其作為消息傳遞給父幀（來自iFrame）。 有沒有辦法做這樣的事情：

<component-z id="component" data1="data" data2="moreData"></component-z>.toHtml()

Answer 1

首先，在行中添加ref屬性，例如ref='component-z'

如果您位於Vue文件的<script>部分內，則可以訪問Vue實例及其引用，如下所示：

this.$refs

要訪問該組件的外部HTML（或呈現/原始HTML），請使用

this.$refs["component-z"].$el.outerHTML

請注意該JavaScript的“component-z”部分，它對應於您設置的ref屬性。