zoukankan      html  css  js  c++  java
  • v-pre&v-cloak&v-once添加属性-禁止值改变 v-once

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <body>
        <div id="box" v-once>  <!-- 控制数据不变  一直为初始值 -->
            {{msg}}
            <div>
                {{msg}}
            </div>
        </div>
        
    </body>
    <script type="text/javascript" src="js/vue.js"></script>
    <script type="text/javascript">
        vu = new Vue({
            el:"#box",
            data:{
                msg:"aaaac"
            }
        })
    vu.$data.msg='2323';  //改变值的一种形式
    vu.msg="2323" //改变值的另一种形式
    </script> </html>

    // 二次视频
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>v-pre&v-cloak&v-once</title>
        <script type="text/javascript" src="js/vue.js"></script>
    </head>
    <body>
        <div id="app">
            <p v-pre>{{message}}</p>  <!--原样输出,浏览器输出就输出 {{message}}-->
            <p v-cloak>渲染完成后,才显示!</p>   <!--Dom渲染完成后  输出内容-->
            <p v-once>{{message}}</p>  <!--只在第一次渲染是渲染时数据载入 。其它进行修改,虚拟Dom变化时  它的数据不变化-->
            <p><input type="text" v-model="message"></p>
            <p>{{message}}</p>
        </div>
    </body>
    <script type="text/javascript">
        new Vue({
            el:"#app",
            data:{
                message:"你好,蔡蔡",
            }
        })
    </script>
    </html>
    
    
    
     
  • 相关阅读:
    Moq4在.NET3.5和.NET4版本之间的差异
    TDD中的迭代
    洛谷 3413 萌数
    割点(tarjan)
    hdu-4507 吉哥系列故事——恨7不成妻
    hdu-3709 Balanced Number
    poj-3252 Round Numbers
    hdu 1007 Quoit Design 分治求最近点对
    LA 3905 Meteor 扫描线
    uva 11464
  • 原文地址:https://www.cnblogs.com/jinsuo/p/7512751.html
Copyright © 2011-2022 走看看