我爱编程vue

v-html指令(html代码)

2017-12-20  本文已影响82人  microkof

v-html指令用于输出html代码。

基本用法

<div id="app">
    <div v-html="message"></div>
</div>
    
<script>
new Vue({
  el: '#app',
  data: {
    message: '<h1><a>菜鸟教程</a></h1>'
  }
})
</script>

v-html指令只能写在标签身上,不能写在文本元素身上。如果要修改文本元素内的文字,可以用{{ message }}的写法。

在网站中动态渲染任意的 HTML 是非常危险的,因为这很容易导致网站受到 XSS 攻击。请只对可信内容使用 HTML 插值,绝对不要对用户提供的内容使用 HTML 插值。

上一篇下一篇

猜你喜欢

热点阅读