vant上传图片和文件，发送到后台传回url

一般上传东西都是file类型的，然后传过去之后，后台返回给我们一个地址，我们再通过这个地址去提交

写案例之前先说下怎么按需导入vant组件吧，一把梭哈全导入的话太影响性能了

cnpm i vant --save
cnpm i babel-plugin-import --save-dev

先安装好这两个，然后在项目的根目录，也就是src平级的目录，建立一个 " .babelrc" 文件

.babelrc

{
  "plugins": [
    ["import", {
      "libraryName": "vant",
      "libraryDirectory": "es",
      "style": true
    }]
  ]
}

先说上传图片demo

import { Uploader } from "vant";
 components: {
    vanUploader: Uploader,
  },

这就是导入我们的组件Uploader

那怎么发送给后台呢??

 PicOnReady(file) {
      var formdata = new FormData();
      formdata.append("file", file.file);
}

后台post请求肯定会让我们传过去一个file类型的参数,你直接把formdata传过去即可

   data: formdata

上传文件的呢？其实差不多，只不过有个地方要改下，就是accept

发送后台跟图片的一模一样