列表中每个对象中的图片都要单独请求

葱头的故事

于 2024-02-01 11:19:51 发布

阅读量186

点赞数 2

文章标签： js

本文链接：https://blog.csdn.net/weixin_43993121/article/details/135969894

版权

文章讲述了在JavaScript中如何使用Promise和async/await技术，通过loadListImg函数逐个获取并处理list中的图片文件，以及getImgFile方法负责从fileId获取图片URL的过程。

摘要由CSDN通过智能技术生成

获取list的时候

this.list = await this.loadListImg(list)

loadListImg

        loadListImg(list) {
            return new Promise((resolve, reject) => {
                let promiseList = list.map(async (ele) => {
                    try {
                        ele.coverUrl = ele.coverFileId ? await this.getImgFile(ele.coverFileId) : ''
                    }
                    catch {
                        ele.coverUrl = ''
                    }
                    return ele
                })

                Promise.all(promiseList).then(res => {
                    resolve(res)
                }).catch((err) => {
                    reject(err)
                })
            })
        },

getImgFile

        getImgFile(fileId) {
            return new Promise((resolve, reject) => {
                previewFile(fileId).then((url) => {
                    let u = URL.createObjectURL(url)
                    resolve(u)
                }).catch((e) => {
                    console.log(e);
                    reject('')
                })
            })
        },