vue 对 v-for 中数组进行过滤操作

Posted chenmz1995

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue 对 v-for 中数组进行过滤操作相关的知识,希望对你有一定的参考价值。

 

之前写angularjs的时候,filter是可以直接在ng-repeat中使用。但是到了vue好像这个不起作用。

 

具体解决办法:

 

加一个计算属性:

        computed:
            filterData: function () 
                console.log(JSON.parse(JSON.stringify(this.data)));
                return JSON.parse(JSON.stringify(this.data));
            
        

 

然后template中直接引用filterData就可以了,所有过滤的操作可以直接写在filterData属性的后面那个function中。

 

使用:

<Row  v-for="(item, index) in filterData"> </Row>

 

注: filterData不能在data中定义,这是一个计算属性,否则会报错。

 

以上是关于vue 对 v-for 中数组进行过滤操作的主要内容,如果未能解决你的问题,请参考以下文章

v-for列表过滤和排序

Vue v-for 循环 - 过滤数组时如何定位组件

vue 遍历数组的巧妙之处

从 Vue 中的 v-for 列表中删除重复项

如何在Vue中对对象数组进行排序和过滤

Vue.js 在 v-for 中重写 orderBy 过滤器