Vue显示未转义的HTML

我怎样才能设法得到一个小胡子绑定HTML解释？ 此刻rest（ <br /> ）只是显示/转义。

小vue应用程序

 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> 

Answer 1

你可以在这里阅读

如果你使用

 {{<br />}} 

它会被逃脱。 如果你想要原始的HTML，你必须使用

 {{{<br />}}} 

编辑（2017年2月5日）：作为@hitautodestruct指出，在第二版中，你应该使用v-html而不是三个花括号。

Answer 2

你可以使用指令v-html来显示它。 喜欢这个：

 <td v-html="desc"></td> 

Answer 3

从Vue2开始，三重大括号已被弃用，您将使用v-html 。

<div v-html="task.html_content"> </div>

从文档链接中不清楚我们应该在v-html放置什么，你的variables会进入v-html 。

而且， v-html只适用于<div>或<span>但不适用于<template> 。

如果你想看到这个生活在一个应用程序，请点击这里 。