vue 对象数组按其中某个属性排序,除了用sort还有什么方法
时间: 2024-10-09 14:05:35 浏览: 34
vue数组对象排序的实现代码
在Vue.js中,如果你想对对象数组按照某个属性进行排序,除了使用`sort()`方法外,还可以考虑使用其他第三方库如`lodash`、`vue-resource` 或者 `axios` 中提供的数组排序函数,或者是利用Vue的响应式特性配合计算属性来做。例如:
1. 使用`lodash`的`_.sortBy`或`_.orderBy`方法:
```javascript
import _ from 'lodash';
data() {
return {
items: [
{ name: 'B', age: 20 },
{ name: 'A', age: 30 },
],
sortedItems: _.sortBy(this.items, 'age')
}
}
```
2. 如果你在Vue组件中使用axios获取数据,可以在响应拦截器中处理排序:
```javascript
methods: {
fetchData() {
axios.get('/api/items').then(response => {
this.items = response.data.sort((a, b) => a.yourProperty - b.yourProperty);
});
}
}
```
3. 利用计算属性做动态排序:
```javascript
computed: {
sortedItemsComputed() {
return this.items.sort((a, b) => a.yourProperty - b.yourProperty);
}
}
```
这样每次`yourProperty`变化时,`sortedItemsComputed`都会自动更新。
阅读全文