uniapp caches images

Cache images locally and still display images when offline

export function cachingImages(filePath) {
	// #ifdef APP-PLUS
	const cacheIamge = uni.getStorageSync(filePath) //查看缓存是否有图片资源,没有则下载
	if (cacheIamge) {
		// console.log("已缓存为:" + cacheIamge)
		return;
	} else { //未缓存,进行下载保存
		uni.downloadFile({
			url: filePath,
			success: (res) => {
				if (res.statusCode === 200) { //下载成功
					// 再进行本地保存
					uni.saveFile({
						tempFilePath: res.tempFilePath,
						success: function(result) {
							uni.setStorageSync(filePath, result.savedFilePath)
						},
						fail: function(erro) {
							// console.log('保存失败')
						}
					})
				} else {
					// console.log('下载临时文件失败')
				}
			},
			fail: (res) => {
				// console.log('下载临时文件失败fail')
			}
		})
	}
	// #endif
}
//使用
<image class="" :src="showImages(图片地址)" mode=""></image>
showImages(imageUrl) {
				const url = uni.getStorageSync(imageUrl)
				return url
			}

Guess you like

Origin blog.csdn.net/matchaa__/article/details/132860057