欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

js实现数据列表上下移动

程序员文章站 2022-03-08 10:12:56
...
//循环中的代码片段
<div @click="shopList == false ? tempSerial(productList, index) : ''">

       <dz-svg-icon iconClass="arrow-up" :class="temp == index && shopList == false ? 'actives' : 'arrow-up'" ></dz-svg-icon>

</div>

<div @click="shopList == false ? downtempSerial(productList, index) : ''">

       <dz-svg-icon iconClass="arrow-down" :class="temp2 == index && shopList == false ? 'actives' : 'arrow-down'" ></dz-svg-icon>

</div>





 tempSerial(item, index) { //向上移动  item是一个数组,index是当前的索引值

      this.temp = index

      this.temp2 = null

      if (index != 0) {

        item[index] = item.splice(index - 1, 1, item[index])[0]

      } else {

        item.push(item.shift())

      }

    },

    downtempSerial(item, index) {//向下移动  item是一个数组,index是当前的索引值

      this.temp = null

      this.temp2 = index

      if (index != item.length - 1) {

        item[index] = item.splice(index + 1, 1, item[index])[0]

      } else {

        item.unshift(item.splice(index, 1)[0])

      }

    },

 

相关标签: js javascript