[英]Rendering html tags in Vue.js
我有以下代码:
HTML
<div id="app">
<h1>
Hello {{superscript('hello')}}
</h1>
</div>
JS
new Vue({
el: "#app",
data: {
},
methods: {
superscript(input) {
return '<sup>' + input + '</sup>'
}
}
})
我希望这个呈现:
你好, 你好
但相反,它会自动渲染标记,而不会将其转换为上标。 JSfiddle: http : //jsfiddle.net/agreyfield91/eywraw8t/188244/
有没有办法通过Vue.js方法添加html标签?
您需要绑定它,而不是呈现html:
{{ result }} => <span v-html="result"></span>
在你的情况下:
<div id="app">
<h1>
Hello <span v-html="superscript('hello')"></span>
</h1>
<h1>
What I want it to look like: Hello <sup>hello</sup>
</h1>
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.