v-text和v-htm

最新推荐文章于 2024-12-07 14:57:34 发布

大雁567

最新推荐文章于 2024-12-07 14:57:34 发布

阅读量149

点赞数

分类专栏： vue

本文链接：https://blog.youkuaiyun.com/weixin_42885193/article/details/104061665

版权

vue 专栏收录该内容

4 篇文章

订阅专栏

v-text和v-html

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Vue.js实例</title>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>

    <div id="app">
        <span>{{ message }}</span>=<span v-text="message"></span><br/>
        <span v-html="msgHtml"></span>
    </div>

    <script type="text/javascript">
        var app=new Vue({
            el:'#app',
            data:{
                message:'hello Vue!<h1>1</h1>',
                msgHtml:'<h2>hello Vue!</h2>'
            }
        })
        
    </script>

</body>
</html>

//就是{{message}} 和 v-text=“message” 是相等的。记住其中点一点变化写法

//v-html可以直接输出html，不是文本输出。