如何在vuetify v-carousel中使用v-bind显示来自Firebase存储网络的图像？

问题描述

我有一个VueJS项目连接到Firebase Firestore和Firebase Storage。

将所有图片的网址下载到Firebase存储中后，我无法将这些图片绑定到v-carousel，我不知道我的错误在哪里

这是我的旋转木马：

<v-carousel>
    <v-carousel-item v-for="image in images" 
                     :key="image.id" 
                     :src="image.src" />
</v-carousel>

这是我的下载网址代码：

import { storage } from "@/firebase/init";
import { db } from "@/firebase/init";
import { images } from "@/firebase/init";

export default {
    data() {
        return {
            images: true,};
    },created() {
        var storageRef = storage.ref();
        storageRef
            .child("Carousel/")
            .listAll()
            .then(function (result) {
                let i = 1;
                result.items
                    .forEach(function (imgRef,i) {
                        // console.log(imgRef.toString());
                        imgRef.getDownloadURL().then(function (url) {
                            //  console.log(url)
                            let ImageUrl = url;
                            images.push({ src: ImageUrl + ".jpg",id: i });
                        });
                        i++;
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            });
        console.log(images);

        itms.push(urls);
    },};

init.js文件：

import * as firebase from "firebase/app";
import "firebase/firestore";
import "firebase/storage";

// Your web app's Firebase configuration
var firebaseConfig = {
    // ......
};

firebase.initializeApp(firebaseConfig);
// export default firebaseApp.firestore()

export default firebase.firestore();

export var storage = firebase.storage();
export let images = [];

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）