02-v-text/v-html 区别

v-text: 用来获取data中数据, 将数据以文本的形式渲染到指定标签内部,类似于js中的innerText

v-html:用来获取data中数据, 将数据中含有的html标签先解析在渲染到指定标签的内部, 类似于js中的innerHtml

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Demo</title>
</head>
<body>

<div id="app">
    
    <span v-text="msg"></span> <br>
    
    <span v-html="msg"></span> <br>
    
</div>

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    let app = new Vue({
        el: '#app',
        data: {
            msg: '<h1>Hello</h1>'
        }
    });
</script>
</body>
</html>

 

 

posted @ 2020-10-16 01:07  Lambda_lalala  阅读(63)  评论(0)    收藏  举报