尝试获取 Firebase 上传进度 - uploadTask.on 不是函数

我正在尝试获取 Firebase 上传的进度，但我尝试监视状态的函数显然是在错误的对象类型上调用的：

Uncaught TypeError: uploadTask.on is not a function
    at VueComponent.submitUpload (eval at 100 (:8080/1.346d5d05d7c5f84c45e7.hot-update.js:7), <anonymous>:231:15)
    at boundFn (eval at <anonymous> (app.js:808), <anonymous>:125:14)
    at VueComponent.invoker (eval at <anonymous> (app.js:808), <anonymous>:1659:18)
    at VueComponent.Vue.$emit (eval at <anonymous> (app.js:808), <anonymous>:1930:16)
    at VueComponent.handleClick (eval at <anonymous> (app.js:1765), <anonymous>:6448:13)
    at boundFn (eval at <anonymous> (app.js:808), <anonymous>:125:14)
    at HTMLButtonElement.invoker (eval at <anonymous> (app.js:808), <anonymous>:1659:18)

这是我上传文件的方式：

 submitUpload: function(){
     var files = this.$refs.upload.uploadFiles;
     var storageRef = storage.ref();
     var pdfsRef = storageRef.child('files');
     var file = files[0]['raw'];
     var name = files[0]['name'];
     var fileref = storageRef.child(name);
     var self = this;
     var uploadTask = fileref.put(file).then(function(snapshot){
     console.log(name + ' is the filename');
     console.log('uploaded');
     var url = snapshot.downloadURL;
     self.gettext(url, name);
     });
     uploadTask.on('state_changed', function(snapshot){
     // Observe state change events such as progress, pause, and resume
     // Get task progress, including the number of bytes uploaded and the total number of bytes to be uploaded
     var progress =  (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
     console.log('upload progress is: ' + progress);
     switch (snapshot.state) {
         case firebase.storage.TaskState.PAUSED: // or 'paused'
         console.log('Upload is paused');
         break;
         case firebase.storage.TaskState.RUNNING: // or 'running'
         console.log('Upload is running');
         break;
     }
     }, function(error) {
     // Handle unsuccessful uploads
     }, function() {
     // Handle successful uploads on complete
     // For instance, get the download URL: https://firebasestorage.googleapis.com/...
         var downloadURL = uploadTask.snapshot.downloadURL;
     });
 },

谁能告诉我为什么uploadTask变量没有此功能可用，我该如何纠正这个问题？我怀疑这是异步问题，但我不知道如何等到uploadTask是观察其状态的正确对象类型。

该声明：

var uploadTask = fileref.put(file).then(...);

分配给uploadTask the Promise由返回then()，而不是UploadTask你要。

将语句更改为：

var uploadTask = fileref.put(file);
uploadTask.then(...);