根据后端接口传来的数字大小对列表进行升序/降序展示
效果图,价格由高到低降序
价格由低到高 升序
js 降序升序代码如下
export default {data() {return {MtList:[]}},onLoad() {this.MtypeName();//加载列表方法},methods: {MtypeName(){//列表方法this.$api.getTypeNameUserID({ctime1:this.ctime3,ctime2:this.ctime4,}).then(res => {//allmoney 金额this.MtList = res.result.sort((a,b)=>b.allmoney-a.allmoney);//降序//this.MtList = res.result.sort((a,b)=>a.allmoney-b.allmoney);//升序})},}
wxml 代码
<view class="typeClassDiv"><view class="typeListClass" v-for="(m,index) in MtList" @click="typeBut(m.typename,m.allmoney,m.bCount)"><image :src="m.typeLogo" class="tyLogo"></image><view class="tyContent"><view class="tytop"><text class='typeNameClass'>{{m.typename}}</text><text class='typeMClass'>{{m.bfb}}%({{m.bCount}}笔)</text></view><view class="tybottom"><view class="progress-box"><progress style="padding-top: 10px;padding-left: 2px;" :percent="m.bfb" stroke-width="3"/></view></view></view><view class="tyFont">¥{{m.allmoney}}</view></view>
</view>
小程序日常记一记 分析页面 可参考