Vue显示未转义的HTML [英] Vue display unescaped html
问题描述
如何设法在胡子绑定中获取html?目前只显示/转义了中断(< br />
)。
How can I manage to get html interpreted inside a mustache binding? At the moment the break (<br />
) is just displayed/escaped.
小vue app
var logapp = new Vue({
el: '#logapp',
data: {
title: 'Logs',
logs: [
{ status: true, type: 'Import', desc: 'Learn<br />JavaScript', date: '11.11.2015', id: 1 },
{ status: true, type: 'Import', desc: 'Learn<br />JavaScript', date: '11.11.2015', id: 1 }
]
}
})
这是模板
<div id="logapp">
<table>
<tbody>
<tr v-repeat="logs">
<td>{{fail}}</td>
<td>{{type}}</td>
<td>{{description}}</td>
<td>{{stamp}}</td>
<td>{{id}}</td>
</tr>
</tbody>
</table>
</div>
推荐答案
从Vue2开始,三个大括号已被弃用,你是使用 v-html
。
Starting with Vue2, the triple braces were deprecated, you are to use v-html
.
< div v-html =task .html_content> < / div>
目前还不清楚文档链接关于我们应该放在 v-html
中的内容,你的变量进入内部 v-html
。
It is unclear from the documentation link as to what we are supposed to place inside v-html
, your variables goes inside v-html
.
此外, v-html
有效仅限< div>
或< span>
但不包含< template>
。
Also, v-html
works only with <div>
or <span>
but not with <template>
.
如果您想在应用中看到这个,点击这里。
If you want to see this live in an app, click here.
这篇关于Vue显示未转义的HTML的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!