vue.js使用v-pre与v-html输出HTML操作示例

2018-09-26 20:08

阅读：531

　　本文实例讲述了vue.js使用v-pre与v-html输出HTML操作。分享给大家供大家参考，具体如下：

<!doctype html> <html lang=en> <head> <meta charset=UTF-8> <meta name=viewport content=width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0> <meta http-equiv=X-UA-Compatible content=ie=edge> <title>输出HTML</title>  <script src=如果想显示{{ }}标签，而不进行替换，使用v-pre即可调过这个元素和它的子元素的编译过程 #--> <span v-pre>{{ 这里的内容不会被编译 }}</span> <span v-html=link></span> </div> </body> </html> <script> var myData = { link:<a href=# rel=external nofollow >这是一个连接</a> }; var app = new Vue({ el:#app, data:myData }) </script>

　　使用本站HTML/CSS/JS在线运行测试工具：，可得到如下测试运行效果：