序

Vue.js是一个流行的JavaScript MVVM库，它是基于数据驱动和基于组件的思想构建的。与Angular.js相比，Vue.js提供了一个更简单、更容易理解的API，使我们能够快速入门和使用Vue.js。最近终于有空了，所以想总结处理一下使用vue过程中遇到的一些问题，方便自己或者有需要的朋友参考。下面就不多说了。我们来看看详细的介绍。

一、计算和计算高速缓存的方法

Html代码：

div id=' app ' p { { msg } }/p preverse { { reverse 2 } }/p/div js

var app=new vue({ El : ' # app ' data : { msg : '初始值' })，methods : { reverse : function(){ this。msg=这个。msg.split(“”)。反转()。join(“”)}，创建了：函数(){ console . log(' msg is created ' new Date())；}，计算出： { reverse2 :函数(){ return this.msg.split(')。反转()。加入(“”)新日期()；} }});

计算属性可以用作普通属性

更改html

div id=' app ' p { { msg } }/pbutton v-: click=' reverse ' { { new Date()} }/button/div

第：号结论

相似度：两者功能相同。区别：计算属性更依赖缓存，也就是说，只要msg(你的数据)不变，计算属性reverse2就不会被重新计算，而是仍然使用前一个。方法意味着您将在每次调用它时重新计算和重新呈现。因此，如果您的计算属性很复杂，您可以考虑使用计算属性，它的缓存可以保持很好。

二、v-if和v-show的区别

V-if:如果初始渲染条件为假，则不执行任何操作。当第一次为真时，将执行本地编译，并缓存该编译。当条件再次为假时，事件侦听器和子组件将被销毁。

V-show:一直存在于dom中，也就是说一直都是编译的。以前，它是根据显示属性进行切换的。

第三，重塑数组的概念

也就是说，有些数组方法在调用后会改变原来的数组——也就是变异方法

调用后不变的原始数组是非突变方法

Vue做不到的地方(关于阵列重塑)

通过设置项目的索引值直接修改数组长度。vm.items[indexOfItem]=newValue。vm.items.length=newLength可用于上述两种供应

Vue。集()拆分()四。显示阵列的过滤和排序

通过返回筛选或排序数组的计算属性

//html ul Li v-for=' n in soets ' { n } }/Li/ul//js computed : { soets : function(){ return this . number . filter(function(num)){ return num 2；})}}通过方法实现：

//html ul Li v-for=' n in sort()' { { n } }/Li/ul//jsmethods : { sort : function(){ return this . number . filter(function(num){ return num 2 })；}}，摘要

以上就是本文的全部内容。希望这篇文章的内容对你的学习或工作有所帮助。有问题可以留言交流。