点击按钮实现文件上传及控制文件上传类型

lixiang 发布于2019-08-26 10:15 / 738人阅读

摘要：原生实现文件上传部分上传文件部分代替执行上传功能上传文件接口地址实现文件上传上传上传文件接口地址上传文件类型设置

1.原生js实现文件上传

html部分:

js部分：

upload(event) {   //代替执行上传功能
  let it = event.target;
  $(it).next().click();
},
UploadFile() {    //上传文件
  let msg = new FormData();
  msg.append("file", $("#uploadBillsInp")[0].files[0]);
  msg.append("enctype", "multipart/form-data");
  this.$post("接口地址",msg, {
headers: {"Content-Type": "multipart/form-data"},
fileType: "text"
}).then(data => {
  console.log(data)
 });},

2.elementUI实现文件上传


  上传
  export default{
    data(){
      return{
        fileList: [],
      }
    },
    methods:{
      UploadFile(content) {//上传文件
        let msg = new FormData();
        msg.append("file", content.file);
        msg.append("enctype", "multipart/form-data");
        this.$post("接口地址", msg, {
          headers: {"Content-Type": "multipart/form-data"},
          fileType: "text"  //上传文件类型设置
        }).then(data => {
          console.log(data);
          }
        });
      },
    }
  }

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/105847.html

【云主机 UHost】操作指南：[镜像]镜像上传及复制镜像

摘要：云主机镜像上传操作步骤将镜像上传至。请选择控制台云主机镜像，点击镜像上传输入镜像相关信息。在控制台，通过云主机登录功能进入虚机内部。点击复制镜像按钮选择需要复制到的项目和地域目前北京一地域不支持复制镜像功能。云主机UHost镜像上传操作步骤1、将镜像上传至US3。因镜像容量通常较大，需要使用客户端或SDK上传。查看说明注意，请将镜像添加至公开存储空间。2、请选择控制台 -> 云主机 -> ...

Tecode 2022-06-28 18:59 评论0 收藏0
解决最后一公里-PTS铂金版发布数据工厂

摘要：压测是目前链路的一个升级，主要是结合了数据工厂的能力，同时名称上也更便于理解。那么，有了数据工厂之后的一次压测的配置过程是怎样的，下面进行下简要介绍。摘要： PTS（Performance Testing Service）是web化、卓越的SaaS性能测试平台，具备强大的分布式压测能力，可模拟海量用户的真实业务场景。PTS铂金版的压力发起来源是遍布全国上百个城市和各运营商的CDN节点...

Dongjie_Liu 2019-05-29 17:05 评论0 收藏0
[未完待续] 上传文件这件事，蛋疼何止一点点！

摘要：在做时，不可避免地要上传一些文件，最常用到的就是图片。提供电子邮件服务的站点，除了图片还需要上传文档等其他类型文件的功能。当点击所看到的按钮时，实际点击的是原生上传控件，这样一来就触发了浏览器默认行为，即打开选择文件对话框。在做 Web App 时，不可避免地要上传一些文件，最常用到的就是图片。在线相册及图片收藏网站等以提供图片存储服务的站点自不用说，社交网络的头像、发布信息等都需要...

tinyq 2019-08-22 10:57 评论0 收藏0
JavaScript精编干货

摘要：老姚浅谈怎么学鉴于时不时，有同学私信问我老姚，下同怎么学前端的问题。撸码听歌，全局控制。浅析用 js 解析 xml 的方法由于项目上需要解析 xml，于是各种百度，然后自己总结了下各个主流浏览器解析 xml 的方法，只能是很浅显的知道他的用法，但是还没有深层次的研究。装 X - 建立自己的斗图网站库之前加过一个斗图群，看到很多经典的表情，然后就收藏到了 QQ，迫于本屌丝开不起...

Fourierr 2019-08-21 18:46 评论0 收藏0