1、orderField,order为传给后台的参数2个参数进行综合、销量、价格对商品进行排序
2、2.1:html
<!--筛选分类-->
<div class="screen_list">
<div :class="selectIndex == 0 ?'synth':''" @click="selectedFn($event)" data-index="0">综合
<img :src='selectIndex == 0 ?"/static/images/single_triangle_red.png":"/static/images/single_triangle_gray.png"'
class='double_triangle'/>
</div>
<div class="clickSales" :class="selectIndex == 1 ?'synth':''" @click='selectedFn($event)' data-index="1">销量
<img v-if='sort =="top" && selectIndex == 1' src='/static/images/triangle_top.png' class='double_triangle'/>
<img v-else-if='sort =="bottom" && selectIndex == 1' src='/static/images/triangle_bottom.png'
class='double_triangle'/>
<img v-else src='/static/images/triangle_default.png' class='double_triangle'/>
</div>
<div class="clickPriceing" :class="selectIndex == 2 ?'synth':''" @click='selectedFn($event)' data-index="2">价格
<img v-if='sort =="top2" && selectIndex == 2' src='/static/images/triangle_top.png' class='double_triangle'/>
<img v-else-if='sort =="bottom2" && selectIndex == 2' src='/static/images/triangle_bottom.png'
class='double_triangle'/>
<img v-else src='/static/images/triangle_default.png' class='double_triangle'/>
</div>
</div>
2.2定义变量
sort: '',
synthesize: '', // 综合
sales: '', // 销量
priceing: '', // 价钱
selectIndex: 0,
orderField: '', // 销售、价格排序
order: '', // 升序降序
2.3js
selectedFn(e) {
let target = e.target
this.selectIndex = target.getAttribute('data-index')
if (this.selectIndex === '1' && this.sort !== 'top') {
this.orderField = 'salesVolume_i'
this.order = 'asc'
this.sort = 'top'
} else if (this.selectIndex === '1' && this.sort !== 'bottom') {
this.orderField = 'salesVolume_i'
this.order = 'desc'
this.sort = 'bottom'
} else if (this.selectIndex === '2' && this.sort !== 'top2') {
this.orderField = 'price'
this.order = 'asc'
this.sort = 'top2'
} else if (this.selectIndex === '2' && this.sort !== 'bottom2') {
this.orderField = 'price'
this.order = 'desc'
this.sort = 'bottom2'
} else if (this.selectIndex === '0') {
this.orderField = ''
this.order = ''
this.sort = ''
}
this.getList()
}