zoukankan      html  css  js  c++  java
  • elementUI 上传多图

    <el-upload
              :action="$store.state.baseURL+'/commonFile/upload.do'"
              list-type="picture-card"
              :on-success="handleSuccess"
              :on-preview="handlePictureCardPreview"
              :file-list="fileList"
              :on-remove="handleRemove">
           <i class="el-icon-plus"></i>
      </el-upload>
       <el-dialog :visible.sync="dialogVisible">
            <img width="100%" :src="dialogImageUrl" alt="">
       </el-dialog>
     
     
     
    // 文件上传成功
            handleSuccess(response, file, fileList) {
                console.log(file)
                 console.log(fileList)
                this.fileList = fileList.map(res => {
                    if(res.raw) {
                        return {
                            name: res.name,
                            id: res.response.data,
                            status: res.status,
                            raw: res.raw,
                            url: res.url
                        } 
                    }else {
                        return {
                            name: res.name,
                            id: res.id,
                            status: res.status,
                            url: res.url
                        }
                    }
                })
                console.log(this.fileList)
            },
     
    handlePictureCardPreview(file) {
                console.log(file)
                this.dialogImageUrl = file.url;
                this.dialogVisible = true;
            }
     
     
     handleRemove(file, fileList) {
                console.log(file)
                console.log(fileList)
                this.fileList = fileList;
            },
  • 相关阅读:
    webstorm 取消拖动代码
    可读流
    页面上怎么使用svg
    从element-ui按需引入去探索
    vue组件库用markdown生成文档
    create-react-app中的babel配置探索
    svg 使用中的疑惑点
    express中是如何处理IP的?
    koa中是如何封装获取客户端IP的?
    博客园文章添加目录
  • 原文地址:https://www.cnblogs.com/lucy1111/p/13387907.html
Copyright © 2011-2022 走看看