van-uploader上传文件以及删除文件

      
图片

在data里面定义字段:

postData: [],
fileIds: []

方法定义:

   delImg (index) {
      // 删除指定下标的图片对象
      if (isNaN(index) || index >= this.postData.length) {
        return false
      }
      let tmp = []
      for (let i = 0, len = this.postData.length; i < len; i++) {
        if (this.postData[i] !== this.postData[index]) {
          tmp.push(this.postData[i])
        }
      }
      this.postData = tmp
      this.fileIds.splice(index,1)
    },
    onRead (file) { // 上传图片到图片服务器
      this.postData.push(file)  // postData是一个数组
      var fd={
        'fileType':'FILE',
        'file':file.content
      }
      this.$http.post('/api/app/files/image', fd).then(res => {
         this.fileIds.push(res) //这里上传到指定的图片服务器,成功后会返回图片的url
      }).catch(err => {
         alert(err)
      })
    }

这个插件可以直接控制最多传几张 postData.length控制

你可能感兴趣的:(vue)