Vue防止花括号闪烁

最新推荐文章于 2022-11-18 21:39:22 发布

阁下长得好生俊俏

最新推荐文章于 2022-11-18 21:39:22 发布

阅读量6.5k

点赞数 1

分类专栏： Vue

本文链接：https://blog.csdn.net/H1069495874/article/details/55504530

版权

Vue 专栏收录该内容

35 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>jsonp</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <style>
        [v-cloak]{
            display: none;
        }
    </style>
    <script src="../js/Vue.js"></script>
    <script src="../js/vue-resource.js"></script>
    <script>
        window.onload = function(){
            var vm = new Vue({
                el:'#box',
                data:{
                    msg:'<strong>模板消息</strong>'
                }
            });
        }
    </script>
</head>
<body>
<div id="box">
    <!--阻止花括号闪烁-->
    <span v-cloak>{{msg}}</span>
    <br>
    <!--阻止花括号闪烁-->
    <span v-text="msg"></span>
    <br>
    <!--2.0写法，v-html可以转义输出html-->
    <span v-html="msg"></span>
</div>
</body>
</html>

阁下长得好生俊俏

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Vue防止花括号闪烁

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jsonp</title> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
复制链接

扫一扫