上载图像到Firebase，没有错误，但是图像未出现在存储设备上

Question

我正在尝试使用Vue尝试Firebase，并尝试将多个图像上传到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
  },
  
});