<template>
<div>
<ul>
<li v-for="item in sortData" :key="item.id">{{ item.name }}: {{ item.value }}</li>
</ul>
</div>
</template>
<script>
export default {
data() {
return {
data: [
{ id: 1, name: 'A', value: 100 },
{ id: 2, name: 'B', value: 200 },
{ id: 3, name: 'C', value: 300 },
{ id: 4, name: 'D', value: 400 },
{ id: 5, name: 'E', value: 500 }
]
}
},
computed: {
sortData() {
return this.data.sort((a, b) => b.value - a.value)
}
}
}
</script>
以上是编程学习网小编为您介绍的“Vue如何实现对数据排序”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
编程基础网
本文标题为:Vue如何实现对数据排序
基础教程推荐
猜你喜欢
- Jquery serialize()方法使用 2023-08-31
- javascript使用正则控制input输入框允许输入的值方法大全 2023-12-15
- 新手学习css优先级 2022-11-16
- Vue修饰符 2023-10-08
- Ajax实现省市县三级联动 2023-02-23
- java后台实现js关闭本页面,父页面指定跳转或刷新操作 2023-12-27
- 好好了解一下Cookie(强烈推荐) 2024-01-12
- 如何使用require.context实现优雅的预加载 2023-08-08
- ajax从JSP传递对象数组到后台的方法 2023-02-14
- vue3.x keep-alive不生效 2023-10-08
