VUE element-ui 图片上传组件支持拖拽排序

1. List item

引用组件

        <template
          slot="textForm"
          slot-scope="scope">
          <div>
            <Upload
              :max="4"
              :value="active"
              v-model="active"
            >
            </Upload>
          </div>
        </template>

1. List item

上传组件

// 上传组件
<template>

  <div class="allUpload">
    <div class="clearfix">
      <div class="wrap">
        <draggable
          v-model="value"
          forceFallback="true"
          animation="400"
          class="clearfix"
        >
          <transition-group>
            <div class="" v-for="(item,index) in value" :key="item.id">
              <!--              <img :src="item.url" class="" alt="" style="width: 146px;height: 146px">-->
              <!--              <div class="content-wrap">-->
              <!--                <div class="content middleCenter">-->
              <!--                  <i class="el-icon-zoom-in" @click="showImg(item.url)"></i>-->
              <!--                  <i class="el-icon-delete" @click="delImg(item,index)"