js数组数据前后数据交换位置

html

<div class="pic-item" v-for="(item,index) in picList"
                         :key="index">
                        <el-image class="pic" @click="handleClickItem"
                                  :src=" item.url" :preview-src-list="[item.url]"/>
                        <i class="el-icon-circle-close delete-list"
                           @click="deleteImage(index)"></i>
                        <div class="displacement">
                            <i class="el-icon-caret-left"
                               @click="up(index)"></i>
                            <i class="el-icon-caret-right"
                               @click="dow(index)"></i>
                        </div>
                    </div>

js

 // 删除图片
        deleteImage (index) {
            this.picList.splice(index, 1)
        },
        // 图片前移
        up (index) {
            if (index <= 0) return
            [this.picList[index - 1], this.picList[index]] =
                [this.picList[index], this.picList[index - 1]]
            this.$forceUpdate()
        },
        // 图片后移
        dow (index) {
            if (index >= this.picList.length - 1) return
            [this.picList[index + 1], this.picList[index]] =
                [this.picList[index], this.picList[index + 1]]
            this.$forceUpdate()
        },```