zoukankan      html  css  js  c++  java
  • Vue学习笔记 ——computed VS methods

    对于最终的结果,两种方式确实是相同的。然而,不同的是计算属性是基于它们的依赖进行缓存的。计算属性只有在它的相关依赖发生改变时才会重新求值。这就意味着只要 message 还没有发生改变,多次访问 reversedMessage 计算属性会立即返回之前的计算结果,而不必再次执行函数。例如:

    <div id="root">
        <p>now is: "{{ method_now() }}"</p>
        <p>cnow is: "{{ computed_now}}"</p>
    </div>
    
    
    var vm = new Vue({
        el: '#root',
        data:'',
        methods:{
            method_now(){
                return Date.now();
            }
        },
        computed:{
            computed_now: function () {
                return Date.now();
            }
        }
    })

    相比而言,只要发生重新渲染,method 调用总会执行该函数。

    我们为什么需要缓存?假设我们有一个性能开销比较大的的计算属性 A ,它需要遍历一个极大的数组和做大量的计算。然后我们可能有其他的计算属性依赖于 A 。如果没有缓存,我们将不可避免的多次执行 A 的 getter!如果你不希望有缓存,请用 method 替代。

  • 相关阅读:
    C# json转对象
    sit、qas、dev、pet
    vs professional 2019 离线安装包下载方法
    C# SHA512和Base64加解密方法
    C#获取客户端Ip工具类
    C#xml泛型序列化
    C#对象转换工具类
    C#记录日志到本地文件工具类
    05 Activity生命周期
    05 利用Appliction 传值Activity
  • 原文地址:https://www.cnblogs.com/web-fusheng/p/7249071.html
Copyright © 2011-2022 走看看