YXGJ/pages/index/modules/preloadedPicture.vue

<template>
    <view>
        <block v-for="(src, index) in imgList" :key="index">
            <image class="image" v-if="index == showIndex" :src="src" @error="imgOnload" @load="imgOnload" />
        </block>
    </view>
</template>

<script>
export default {
    data() {
        return {
            showIndex: 0,
            imgList: ['https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202404111712812810046B1fbafed9.png',
                'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202405151715764356769B1a729abd.webp',
                'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202405281716860202553Be55ba55.webp',
                'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202405281716861339513B3a575413.webp',
                'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202404101712715614059B373541f3.png',
                'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202404101712714494391B1100afab.png',
                'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202404101712714638752Bc18af43.png',
                'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202404101712714733820B3d50bdd4.png',
                'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202404101712714646946B480ca84d.png',
                'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202404101712714656283B28c9d1df.png',
                'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202405081715135815557B4db50f9.webp',
                'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202405291716965428111B4602d616.webp',
                'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202405281716863577428B1faf5081.webp',
                'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202406011717209838416B6150695f.webp',
                'https://yossys06593.obs.cn-east-3.myhuaweicloud.com:443/202404241713944430197B47af9b2f.png',
            ]
        }
    },
    methods: {
        imgOnload() {
            this.showIndex += 1;
            if (this.imgList.length == this.showIndex) console.log("图片资源预加载完成")
        }
    }
}
</script>

<style lang="scss" scoped>
.image {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0;
    z-index: -99999999;
}
</style>