您现在的位置是:网站首页> 编程资料编程资料

关于vue中计算属性computed的详细讲解_vue.js_

2023-05-24 424人已围观

简介 关于vue中计算属性computed的详细讲解_vue.js_

1.定义

computed是vue的计算属性,是根据依赖关系进行缓存的计算,只有在它的相关依赖发生改变时才会进行更新

2.用法

一般情况下,computed默认使用的是getter属性

3.computed的响应式依赖(缓存)

1. computed的每一个计算属性都会被缓存起来,只要计算属性所依赖的属性发生变化,计算属性就会重新执行,视图也会更新。下面代码中,计算属性fullName,它依赖了firstNamelastName这两个属性,只要它们其中一个属性变化,fullName就会重新执行。

2.computed计算属性会被缓存,在下面代码中使用了两次fullName,但在控制台只输出了一次 “这是fullName”。

4.应用场景

当一个数据受多个数据影响时,可以使用computed

1.本组件计算

2.计算props的值

3.计算vuex的state或者getters值的变化

附:计算属性的 getter 与 setter

默认情况下,计算属性函数是一个 getter 函数,如果计算属性只有 get 需求,则可以简写

               Document          
       
                                    +                         =                    
        {{o}}    
   

参考:https://cn.vuejs.org/v2/guide/computed.html

           https://segmentfault.com/a/110000012948175

总结

到此这篇关于vue中计算属性computed的详细讲解的文章就介绍到这了,更多相关vue计算属性computed内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!

-六神源码网