2024年08月22日 建站教程
利用uniapp
开发,如何实现table
进行排序,下面web建站小编给大家简单介绍一下具体实现代码!
安装脚手架
//安装uni-app-cli: npm install -g uni-app-cli //安装uni-ui插件: npm install @dcloudio/uni-ui
table进行排序
<template> <view> <uni-table :title="title" :header="header" :body="body" :order="order" @switch-order="switchOrder" /> </view> </template> <script> import { uniTable } from '@dcloudio/uni-ui' export default { components: { uniTable }, data () { return { title: '表格标题', header: ['姓名', '年龄', '性别'], body: [ { name: '小明', age: 18, gender: '男' }, { name: '小红', age: 20, gender: '女' }, { name: '小刚', age: 22, gender: '男' } ], order: null } }, methods: { switchOrder (order) { this.order = order if (order) { this.body.sort((a, b) => { return order === 'asc' ? a.age - b.age : b.age - a.age }) } } } } </script>
本文链接:http://so.lmcjl.com/news/11419/