rails文件直传说明

Direct Uploads教程

我的用法

import { DirectUpload } from 'activestorage'

uploadFile (file) {
        // activestorage: direct_upload
        let vm = this
        const url = '/rails/active_storage/direct_uploads'
        const upload = new DirectUpload(file, url, upload)

        return new Promise((resolve, reject) => {
          upload.create((error, blob) => {
            if (error) {
              console.log(error)
              vm.$Message.error(error)
            } else {
              // Add an appropriately-named hidden input to the form with a value of blob.signed_id
              console.log(blob)
              resolve(blob.signed_id)
            }
          })
        })
      }

需求

希望加上上传进度提示，因此需要获取上传进度

问题

教程示例为：

import { DirectUpload } from "activestorage"
 
class Uploader {
  constructor(file, url) {
    this.upload = new DirectUpload(this.file, this.url, this)
  }
 
  upload(file) {
    this.upload.create((error, blob) => {
      if (error) {
        // Handle the error
      } else {
        // Add an appropriately-named hidden input to the form
        // with a value of blob.signed_id
      }
    })
  }
 
  directUploadWillStoreFileWithXHR(request) {
    request.upload.addEventListener("progress",
      event => this.directUploadDidProgress(event))
  }
 
  directUploadDidProgress(event) {
    // Use event.loaded and event.total to update the progress bar
  }
}

源码：https://github.com/rails/rail...

DirectUpload的实例不是应该能访问directUploadWillStoreFileWithXHR, directUploadDidProgress方法吗，但是我这么调用会报错没有该方法，求搭救