Vue.js:无法在v-for中订购

Question

我升级到Vue.js 2.0.5并且v-for中的orderBy似乎不再起作用了

<li v-for="c in rooms | orderBy 'last_iteraction'">

输出

• 表达式无效:v-for ="c in rooms | orderBy'last_iteraction'"

谁知道怎么解决？

Answer 1

orderBy过滤器在vue.js v-2中删除.

引用自vue.js文档

代替:

<p v-for="user in users | orderBy 'name'">{{ user.name }}</p>

在计算属性中使用lodash的orderBy(或者可能是sortBy):

<p v-for="user in orderedUsers">{{ user.name }}</p>

computed: {
  orderedUsers: function () {
    return _.orderBy(this.users, 'name')
  }
}

参考:

https://vuejs.org/v2/guide/migration.html#Replacing-the-orderBy-Filter

Answer 2

您还可以使用vue2过滤器包.

1)首先使用npm安装它.

npm install vue2-filters

2)然后,将其添加到组件中或全局添加.

import Vue from 'vue'
import Vue2Filters from 'vue2-filters'

Vue.use(Vue2Filters)

3)之后在模板中使用它

<li v-for="c in orderBy(rooms,'last_iteraction')"> 

有一个预定义过滤器列表.检查出来.

参考:

https://github.com/freearhey/vue2-filters