在Vue中有很多特殊的标签属性，这些属性一般以’v’开头，用于在标签中实现特殊的功能。
例如，当Vue实例的data是一个inner html，我们想在网页上渲染这部分html，如果依然使用之前的{{ variable }}，则只会将inner html的源码显示出来，无法进行渲染。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script>
<div id="box">
{{msg}}
<!-- <div v-html="msg"></div> -->
</div>
<script>
const app = new Vue({
el: "#box",
data:{
msg:`
<a href="https://blog.csdn.net/ShadyPi">
ShadyPi's blog
</a>`
}
})
</script>
</body>
</html>
效果如下：
但是如果把容器中的元素添加一个标签属性v-html，并将该属性的值赋为msg，即
<div v-html="msg"></div>
则能成功渲染出指向我博客的超链接：
