zoukankan      html  css  js  c++  java
  • vue上传文件

    上传按钮

    <button @click="clickUploadSpider">
                  批量上传
                  <!--     @click.stop  防止冒泡     -->
                  <input type="file" id="uploadSpider"
                         class="upload-input-none" @click.stop
                         @change="uploadSpider($event)"
                         multiple>
    </button>
    

    js中方法

        //点击上传按钮时触发的事件,打开文件选择框
        clickUploadSpider () {
          let file = document.getElementById('uploadSpider')
          // 让值发生变化,input的@change事件才会响应
          file.value = ''
          file.click()
        },
        // 选完文件后触发的回调事件
        async uploadSpider (e) {
          // 要上传的url弟子
          let url = "*********"
          this.uploadFile(url, e)
        },
        uploadFile (url, e) {
          let files = e.target.files
    
          if (files.length == 0) {
            return
          }
          // 参考:https://www.jianshu.com/p/9c708a47d8a5?utm_campaign=maleskine&utm_content=note&utm_medium=seo_notes&utm_source=recommendation
          //设置参数
          let formData = new FormData()
          Array.from(files).forEach(file => {
            formData.append('files', file)
          })
    
          //设置请求头
          let config = {
            //添加请求头
            headers: {
              'Content-Type': 'multipart/form-data'
            },
          }
    
          //发送请求
          await post(formData, url, config).then(res => {
            if (res.data.success) {
              this.$hMessage.success('批量导入成功')
            } else {
              console.log("失败")
            }
          }).catch(err => {
            console.log(err.message)
          })
        },
    
  • 相关阅读:
    翻转单词顺序序列
    左旋转字符串
    查找第一个只出现一次的字符
    C语言函数与程序结构
    C语言实现快速排序法(分治法)
    C语言binsearch,shellsort,insertsort
    c语言的类型、运算符与表达式
    进程和线程
    CMS和G1
    Python IO编程
  • 原文地址:https://www.cnblogs.com/yloved/p/14784973.html
Copyright © 2011-2022 走看看