Как я могу сделать индикатор выполнения, когда я загружаю изображение в хранилище Firebase?

Question

Я хочу добиться прогресса, чтобы показать пользователю, сколько файлов загружено, чтобы он не выходил из середины загрузки. Может ли кто-нибудь помочь мне с тем, как я могу сделать индикатор выполнения в vue js

iЯ использую этот код Firebase, чтобы показать процент Я использовал v-модель и теги p, чтобы показать процент, но ничего не работает

методы: {

uploadfiles(e) {
  var storage = firebase.storage();
  var user = firebase.auth().currentUser;
  var file = e.target.files[0];
  var path = "users/" + user.uid + "/attachments/" + Date.now() + ".jpg";
  var storageRef = storage.ref(path);
  var task = storageRef.put(file);
      task.on('state_changed');
    function progress (self, snapshot){
      var percentage = (snapshot.bytesTransferred/snapshot.totalBytes)*100;
        console.log('this is image =',percentage);
          self.progress = percentage;
           console.log(progress);
    }

    task.then(snapshot => {
      console.log("image uploaded successfully");
      //saveMessageInDatabase(newmessagedata);
      return task.snapshot.ref.getDownloadURL();
    })
    .then(url => {
      console.log("download url of image", url);
      this.username.image = url;
      console.log(this.username.image);
    })
    .catch(error => {
      // hideMessageDialog();
      console.log("image uploaded error");
    });
}

} HTML

  <p>{{this.progress}}%</p>

   <progress max="100"  :style="{width: progress+'%'}" value="0"> 
 </progress> 

<div class="progress-bar" role="progressbar" v-bind:aria-valuenow="this.progress" aria-valuemin="0" aria-valuemax="100" :style="{width: this.progress+'%'}"></div>

    <input id="pic" type="file"  @change="uploadfiles">

Answer 1

  function progress (self, snapshot){
      var percentage = (snapshot.bytesTransferred/snapshot.totalBytes)*100;
      console.log('this is image =',percentage);
      self.progress = percentage ;
    console.log(progress);
  }

Анализ this для функционирования progress как self.
С this.progress = percentage ;, this означает function progress.