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
    })
    }
  • 相关阅读:
    个人总结
    团队作业五
    个人项目五:个人回顾
    第二次冲刺
    第一次冲刺
    猜数字1
    随机数
    个人作业
    课后作业1
    作业
  • 原文地址:https://www.cnblogs.com/lixiaosong/p/15476477.html
Copyright © 2011-2022 走看看