zoukankan      html  css  js  c++  java
  • Vue模板语法——v-once 数据响应式

    一、数据响应式

    1. 如何理解响应式

      • html5中的响应式:屏幕尺寸的变化导致样式的变化
      • 数据的响应式:数据的变化导致页面内容的变化
    2. 什么是数据绑定

      数据绑定:将数据填充到标签中

    3. v-once只编译一次

      显示内容之后不再具有响应式功能

    二、v-once指令

    1. v-once 应用场景

      如果显示的信息后续不需要再修改,可以使用v-once,这样可以提高性能。

    2. v-once用法

      在需填充的标签中添加v-once指令

    3. 例如

          <div id='app'>
            <div>{{msg}}</div>
            <div v-once>{{info}}</div>
          </div>
          <script type="text/javascript" src="js/vue.js"></script>
          <script type="text/javascript">
             var vm =new Vue({
                   el:'#app',
                   data:{
                      msg:'HelloWorld',
                      info:'Vue是真得好!!!'
                   }
             })
          </script>
    

    结果:
    在浏览器控制台中,可通过vm.msg=***改变msg的值,而不能使用vm.info=***来修改info的值

  • 相关阅读:
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
    Learn Prolog Now 翻译
  • 原文地址:https://www.cnblogs.com/fpgz99810/p/12465819.html
Copyright © 2011-2022 走看看