zoukankan      html  css  js  c++  java
  • 关于element文件上传

    html部分:

    <el-form-item label="图片" prop="icon">
    <el-upload
    v-model="rotationfrom.img"
    action=""
    multiple
    show-file-list
    :http-request="httpRequest"
    list-type="picture-card"
    :on-preview="handlePictureCardPreview"
    :on-remove="handleRemove"
    :file-list="fileList"
    >
    <i class="el-icon-plus" />
    </el-upload>
    <el-dialog :visible.sync="dialogVisibleimg">
    <img width="100%" :src="rotationfrom.img" alt="">
    </el-dialog>
    </el-form-item>
    js部分:
      方法部分
      
    // 图片上传
    async httpRequest(options) {
    console.log(options)
    const fd = new FormData()
    fd.append('file[]', options.file)
    const res = await Upimg(fd)
    // 图片上传成功后把图片push到scroll中用于修改
    console.log(res)

    if (res.status !== 200) {
    return this.$message.error('上传失败')
    } else {
    this.rotationfrom.img = res.data[0].url

    console.log(res)
    console.log(this.rotationfrom)
    }
    },
    封装部分:
    import axios from 'axios'
    // 上传图片
    export function Upimg(data) {
    return axios({
    url: 'https://ssssssd',
    method: 'post',
    headers: {
    'Content-Type': 'application/x-www-form-urlencoded',
    'Accept': '*/*',
    'X-requested-with':'XMLHttpRequest'
    },
    data
    })
    }
  • 相关阅读:
    【ccf线上赛普及组 2020】
    【小总结】2020.3.6
    DP优化
    noip2012day2
    noip2012day1
    3.28真题
    数据结构总结
    noi online 普及组
    小总结
    20200229模拟赛
  • 原文地址:https://www.cnblogs.com/lixiaosong/p/15476477.html
Copyright © 2011-2022 走看看