Java程序员从笨鸟到菜鸟（三十八）vue

本文主要是介绍Java程序员从笨鸟到菜鸟（三十八）vue，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

一、methods和computed的区别

1.实现上：

<div id="app-9"><p>Original message: "{{ message }}"</p><p>Methdos reversed message: "{{ Methods() }}"</p><p>Computed reversed message: "{{ Computed }}"</p>
</div><script>
var app9 = new Vue({el: '#app-9',data: {message: 'hello'},methods: {Methods: function() {return this.message.split('').reverse().join('')}},computed: {Computed: function() {return this.message.split('').reverse().join('')}}
})
</script>

运行结果：

Original message: "hello"
Methdos reversed message: "olleh"
Computed reversed message: "olleh"

methods：相应的方法名后面需要加()

2.缓存

computed计算属性时基于他们的依赖进行缓存的，计算属性只有在它的相关依赖发生改变时才会重新求值。这就意味着只要 message 还没有发生改变，多次访问 Computed计算属性会立即返回之前的计算结果，而不必再次执行函数

为什么要用缓存：当有一个性能开销比较大的计算属性A，它需要遍历一个极大的数组做大量的运算，然而我们有可能有其它属性依赖A，如果没有缓存，我们将不可避免的多次执行 A 的 getter！

总之：需要缓存用computed，不需要缓存用methods

这篇关于Java程序员从笨鸟到菜鸟（三十八）vue的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---