程序员的资源宝库

网站首页 > gitee 正文

上传图片 原生或vant 原生js图片上传

sanyeah 2024-03-29 15:20:46 gitee 10 ℃ 0 评论

一 css

1.原生

<input type="file" @change="changeImage" />
 

2 vant

<van-uploader :after-read="changeImage"></van-uploader>
(after-read,before-read,before-delete 类似三个钩子函数)
 

二 js

post请求时,upfile 的位置不要加 { } 会造成传值错误

changeImage(e) {
      //vant 的file路径
      //var fil = e.file

      // 原生 file路径
      var fil = e.target.files[0]

      var upfile = new FormData(); //创建form对象
      upfile.append("upfile", fil); //通过append向form对象添加数据第一个参数字符串与后端约定,第二个根据对象属性来找到file
      this.$http
        .post("/url/xx/xx", upfile, {
          headers: {
            "Content-Type": "multipart/form-data" //添加请求头
          }
        })
        .then(res => {
          window.console.log(res);
        })
        .catch(err => {
          window.console.log(err);
        });
    },

 

 

  

 

 
 

Tags:

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表