Javascript Vue将HTML编写为字符串变量/字符串模板的方法

在香草Javascript中，我们有时需要使用字符串HTML，结果会变得很难看。我想知道是否有一种方法可以生成一个

，并将其分配给一个变量，而不是编写类似

var myHtml = "<div class='row'>This is my text</div>"

var myHtml=“这是我的文本”

很明显，这个例子很短，不会伤害，但是当它变得非常大时考虑。

可能是这样的：

var myHtml = `<div>This is good</div>`

var myHtml=`这很好`

或许

<template ref="myHtmlBlock">Text</template>

var myHtml = $refs.myHtmlBlock

文本
var myHtml=$refs.myHtmlBlock

主要目的是在块内使用变量，这样我可以说

data() {
   return {
     myText: "Hello"
   }
} 

var html = `<div>{{ this.myText }}</div>`

data（）{
返回{
myText：“你好”
}
} 
var html=`{this.myText}}`

与之相比：

var html = "<div>" + this.myText + "</div>"

var html=”“+this.myText+“”

看看：

它很好地概括了你的选择。当然，您的最佳选择是基于项目需求

最近，我使用了X模板。它区分了HTML内容，这有其优点和缺点：

• 赞成：设计师可以在不干扰代码的情况下实现这一点
• 缺点：这是另一个需要包含和管理的文件

---

X-Templates对我来说工作得很好，似乎可以处理更大的HTML编码。

可能正在寻找原始HTML嘿！我正在尝试使用html中的双括号做同样的事情，并将其绑定到组件数据。你有没有找到这样做的方法？谢谢谢谢你的提醒