Загрузка изображения в Firebase без ошибок, но изображение не появляется в хранилище

Question

Я пробую Firebase с Vue и пытался загрузить несколько изображений в Firebase Storage.Мой код выполняется без ошибок, но я не вижу изображения в хранилище.

Вот что я делаю:

for (var i = 0; i < payload.files.length; i++) {
                        console.log(payload.files[i])
                        const filename = payload.files[i].name
                        const fileExtension = filename.slice(filename.lastIndexOf('.'))
                        db.storage().ref(i + '.' + fileExtension).put(payload.files[i])
                            .then(data => {
                                key = data.key
                                return key
                            })
                            .then(key => {
                                let filename = payload.files[i].name
                                // let ext = filename.slice(filename.lastIndexOf('.'))
                                return firebase.storage().ref(`test/${filename}`).put(payload.files[i])
                            })
                            .then(fileData => {
                                let urlFile = fileData.metadata.fullPath
                                return firebase.storage().ref().child(urlFile).getDownloadURL()
                            })
                            .then(url => {
                                urlUploaded = url
                                //   firebase.database().ref('allFiles').child(key).update({urlUploaded: urlUploaded})
                            })
                            .then(() => {
                                commit('upFiles', { ...file,
                                    urlUploaded: urlUploaded,
                                    id: key
                                })
                                commit('setLoading', false)
                            })
                            .catch(error => console.log(error))
                    }

Что я делаю не так?Любая помощь приветствуется.

Answer 1

Sir in my little knowledge 


//For your html code
<div id="appimg">
	   <ol>
		<li v-for="img in imgs"><img class="card-img-top" src="{{img}}" 			alt="no Image"></li>
	   </ol>
   </div>


// ad with js
const vimg = new Vue({
  el: '#appimg',
  data: {
	imgs: payload.files
  },
  
});