ElementUI 中Upload上传图片插件（方便自己查阅使用的，不做参考）哈哈哈哈哈哈哈哈哈哈哈哈

最新推荐文章于 2024-07-31 11:01:23 发布

·港岛妹妹

最新推荐文章于 2024-07-31 11:01:23 发布

阅读量210

点赞数

分类专栏： vue

本文链接：https://blog.csdn.net/qq_44417271/article/details/118303968

版权

vue 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

<el-form-item label="域名（网址）状态" prop="isHealthy">
            <el-radio-group v-model="dataEdit.isHealthy">
              <el-radio :label="1">正常</el-radio>
              <el-radio :label="0" @change="isOne">异常</el-radio>
              <el-radio :label="2">未连接</el-radio>
            </el-radio-group>
            <div v-if="dataEdit.isHealthy == 0">
              <el-upload
                ref="my-upload"
                action="/apis/hmfsMedia/v2/image/upload"
                accept="image/*"
                :limit="5"
                :data="{
                  areaLayer: this.$store.state.areaLayer,
                  sourceType: 5,
                  description: '后台网络主体',
                }"
                list-type="picture-card"
                :on-preview="handleNetworkPreview"
                :on-remove="handleNetworkRemove"
                :on-success="NetworkUplandimg"
                :on-change="handleNetworkChange"
                :name="'image'"
                :auto-upload="true"
                :file-list="NetworkImageList"
                v-if="dataEdit.isHealthy == 0"
                :class="{ hide: NetworkHideUpload }"
              >
                <i class="el-icon-plus"></i>
              </el-upload>
              <el-dialog
                :visible.sync="NetworkImageVisible"
                :close-on-click-modal="false"
                :append-to-body="true"
              >
                <img width="100%" :src="NetworkImageUrl" alt="" />
              </el-dialog>
              <span
                style="font-size: 12px; color: #e81515; vertical-align: bottom"
                >!请上传域名(网址)凭证，此凭证将生成线索
                </span
              >
            </div>
          </el-form-item>

handleNetworkPreview(file) {
      this.NetworkImageUrl = file.url;
      this.NetworkImageVisible = true;
    },
    handleNetworkRemove(file, fileList) {
      this.NetworkHideUpload = false;
    },
    NetworkUplandimg(res, file) {
      let resurl = res.result;
      file.formatUrl = resurl;
    },
    handleNetworkChange(file, fileList) {
      this.NetworkPictures = fileList;
      if (fileList.length >= 5) {
        this.NetworkHideUpload = true;
      }
    },