vue商城之综合销量价格等排序

请求方式：

HTML：

 <div class="sui-navbar">
            <div class="navbar-inner filter">
              <ul class="sui-nav">
                <li
                  @click="orderList(index)"
                  :class="currIndex == index ? 'active' : ''"
                  v-for="(item, index) in orderarr"
                  :key="item.id"
                >
                  <a href="#"
                    >{
    
    {
    
     item.oName }}
                    <span
                      v-if="flag && currIndex == index"
                      class="iconfont icon-jiantou-shang"
                    ></span>
                    <span
                      v-if="flag == false && currIndex == index"
                      class="iconfont icon-jiantou-xia"
                    ></span>
                  </a>
                </li>
              </ul>
            </div>
          </div>

  data() {
    
    
    return {
    
    
      currIndex: 0,     
      flag: true,
      orderarr: [
        {
    
     id: 0, oName: "综合" },
        {
    
     id: 1, oName: "价格" },
        {
    
     id: 2, oName: "销量" },
        {
    
     id: 3, oName: "评价" },
      ],
      searchParams: {
    
     
        order: "1:desc",      
       },
 }

  methods: {
    
    
    orderList(index) {
    
    
      this.currIndex = index;
      this.flag = !this.flag;

      if (this.flag) {
    
    
        this.searchParams.order = `${
      
      this.currIndex + 1}:asc`;
        this.getData();
      } else {
    
    
        this.searchParams.order = `${
      
      this.currIndex + 1}:desc`;
        this.getData(); // 请求的数据，这里不做解析
      }
    },
}