将Firebase downloadURL传递给本地变量

Question

I have this upload image in firebase that returning a downloadURL, how can I pass that value to my local variable image_url in vue js?

//local variable
data(){
   return{
        image_url : '',
   }
}

button trigger to upload an image

<div class="col col-md-2 text-right pad-left">
     <md-button 
        class="btn-block 
        md-raised md-primary" 
        v-on:click="createOrUpdateUser()">Submit
     </md-button>
</div>

function to upload an image

createOrUpdateUser(){
   // Create a root reference
   var storageRef = firebase.storage().ref('/images/' + 
   this.filename);      

   var uploadTask = storageRef.put(this.image);

   uploadTask.on('state_changed', function(snapshot){

        }, function(error) {

        // Handle unsuccessful uploads
        }, function() {

        // Handle successful uploads on complete
        // For instance, get the download URL: 
        https://firebasestorage.googleapis.com/...

        uploadTask.snapshot.ref.getDownloadURL().then(function(downloadURL) {

             //i need to pass downloadURL to the image_url variable above...
             console.log('File available at', downloadURL);
        });
   });
}

Answer 1

// ...
data() {
   image_url: ''
},
methods: {
  var self = this;
  createOrUpdateUser: function () {
      //... your code
      uploadTask.on('state_changed', function(snapshot){

      }, function(error) {

      // Handle unsuccessful uploads
      }, function() {

      // Handle successful uploads on complete
      // For instance, get the download URL: https://firebasestorage.googleapis.com/...

      uploadTask.snapshot.ref.getDownloadURL().then(function(downloadURL) {
         //i need to pass downloadURL to the image_url variable above...
         self.image_url = downloadURL
         console.log('File available at', downloadURL);
       });
    });

    }
  }