标签:arr 函数 price filter var 排序 id match name
<template> <div class="hello" ref="box"> <div class="top-hospital-cont"> <div class="dengjis">{{hospitalObj.structureLevelName}}</div> <div class="hospital-cont-right"> <div>{{hospitalObj.organizationName}}</div> <div>{{hospitalObj.structureCharacter}}{{hospitalObj.structureLevelName}}</div> <div style="font-size:12px;">可预约时间 {{hospitalObj.appointmentTime}}</div> </div> </div> <div class="title"> 套餐列表 </div> <div class="shai-cont"> <ul class="shai-ul"> <li> <select placeholder="排序" class="public-choice" name="public-choice" v-model="couponSelected"> <option :value="coupon.name" v-for="(coupon, index) in couponList" :key="index">{{ coupon.name }}</option> </select> </li> <li> <!-- @change="getCouponSelected" --> <select class="public-choice" name="public-choice" v-model="couponSelecteds"> <option :value="coupon.name" v-for="(coupon, index) in couponsLists" :key="index">{{ coupon.name }}</option> </select> </li> <li class="last-li"> <!-- @change="getCouponSelected" --> <select class="public-choice" name="public-choice" v-model="couponSelecteds2"> <option :value="coupon.name" v-for="(coupon, index) in couponsLists2" :key="index">{{ coupon.name }}</option> </select> </li> <li> <!-- @change="getCouponSelected" --> <select class="public-choice" name="public-choice" v-model="couponSelected3"> <option :value="coupon.name" v-for="(coupon, index) in couponsLists3" :key="index">{{ coupon.name }}</option> </select> </li> </ul> </div> <div class="list-item" v-for="(item,index) in fileterlist" :key="index"> <div class="list-item-right"> <div>{{item.name}}</div> <div class="name">适用人群:{{item.people}}</div> <div class="name"> {{item.price}}元 <span class="list-item-right-sapn">已售{{item.sell}}</span> </div> </div> </div> </div> </template> <script> export default { data () { return { search:"", couponsLists: [{ id: "0", name: "筛选全部" }, { id: "1", name: "男" }, { id: "2", name: "女" }, ], couponList: [{ id: "0", name: "排序全部" }, { id: "1", name: "销量↑" }, { id: "1", name: "金额↑" }], couponsLists2: [{ id: "0", name: "金额全部" }, { id: "0", name: "200以下" }, { id: "1", name: "200-500" }, { id: "2", name: "500-1000" }, { id: "2", name: "1000以上" }], couponsLists3: [{ id: "0", name: "入职体检" }, { id: "0", name: "婚前体检" }], couponSelecteds2: "金额全部", couponSelected: "排序全部", couponSelecteds: "筛选全部", couponSelected3:"入职体检", list: [ { name:"高血压套餐", people:"使用人群男", price:200, sell:300 }, { name:"糖尿病套餐", people:"使用人群女", price:1000, sell:20000 }, { name:"心虚管套餐", people:"使用人群男女", price:400, sell:500 }, { name:"心虚管套餐", people:"使用人群男女", price:900, sell:20 }, ], hospitalObj: {} }; }, computed:{ fileterlist:function(){ var arr=this.list.filter((value)=>{ var a=value.name.match(this.search); var b=false; /*性别*/ if(this.couponSelecteds=="筛选全部"){ b=true }else { b=value.people.match(this.couponSelecteds); } /*价格排序*/ var xj=false; if(this.couponSelecteds2.match("金额全部")){ xj=true }else if(this.couponSelecteds2.match("200以下")){ xj=value.price<=200 } else if(this.couponSelecteds2.match("200-500")){ xj= value.price>=200&&value.price<=500 } else if(this.couponSelecteds2.match("500-1000")){ xj= value.price>=500&&value.price<=1000 } else if(this.couponSelecteds2.match("1000以上")){ xj=value.price>1000 } /*销量金额排序*/ return a&&b&&xj }) var xlj=false; if(this.couponSelected.match("排序全部")){ xlj=true; }else if(this.couponSelected.match("销量↑")){ console.log(11) console.log(arr) for(var i=0;i<arr.length;i++){ console.log(arr) for(var j=i;j<arr.length;j++){ if(arr[i].sell>arr[j].sell){ var tmp=arr[i]; arr[i]=arr[j]; arr[j]=tmp; } } } }else if(this.couponSelected.match("金额↑")){ for(var i=0;i<arr.length;i++){ console.log(arr) for(var j=i;j<arr.length;j++){ if(arr[i].price>arr[j].price){ var tmp=arr[i]; arr[i]=arr[j]; arr[j]=tmp; } } } console.log(arr) } return arr } }, }; </script>
标签:arr,函数,price,filter,var,排序,id,match,name 来源: https://www.cnblogs.com/xzhce/p/13046728.html
本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享; 2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关; 3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关; 4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除; 5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。