vue指令 v-html 繫結html程式碼
阿新 • • 發佈:2020-12-29
更新元素的 innerHTML。
注意:內容按普通 HTML 插入 - 不會作為 Vue 模板進行編譯。
<template>
<div class="hello">
<span v-html="aHtml"></span>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
data () {
return {
aHtml: "<a href='https://www.baidu.com'>張三丰</a>"
}
},
methods: {
},
async created () {
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h1, h2 {
font-weight: normal;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>