缓存图片

src/pages/index/mine.vue

@@ -47,7 +47,9 @@
 				serviceTel: '18124099271',
 				showSuperButton: false,
 				show: false,
-				content: '是否确认退出该账户？'
+				content: '是否确认退出该账户？',
+				wodebeijingImage: '',
+				placeholderImage: ''
 			}
 		},
 		computed: {
@@ -122,12 +124,6 @@
 			headImageUrl() {
 				return this.avatar || this.placeholderImage
 			},
-			wodebeijingImage() {
-				return util.imageCache(this, 'wodebeijing.png')
-			},
-			placeholderImage() {
-				return util.imageCache(this, 'touxiang.png')
-			},
 			headImageStyle() {
 				return this.avatar ? 'width:136rpx; height:136rpx;border-radius:68rpx' : 'width:144rpx; height:144rpx;border-radius:72rpx'
 			},
@@ -135,7 +131,7 @@
 				return this.avatar ? 136 : 144
 			}
 		},
-		onLoad() {
+		async onLoad() {
 			app.trackPage('我的首页')
 			if(this.vuex_token ) {
 				if (!this.showSuperButton) {
@@ -146,7 +142,8 @@
 					this.getData()
 				}
 			}
-			
+			this.wodebeijingImage = await util.imageCache(this, 'wodebeijing.png')
+			this.placeholderImage = await util.imageCache(this, 'touxiang.png')
 		},
 		methods: {
 			getData() {

src/utils/util.js

@@ -35,15 +35,18 @@ const setOpenid = function (openid) {
 	}
 }
 
-async function validImages(imgurl) {
-    let exists = false
-	await uni.getImageInfo({
-      src: imgurl,
-      success (res) {
-    	exists = true
-      }
-    })
-	return exists
+function validImages(imgurl) {
+	return new Promise((resolve, reject) => {
+		uni.getImageInfo({
+				src: imgurl,
+				success (res) {
+					resolve(true)
+				},
+				fail () {
+					reject(false)
+				}
+			})
+	})
 }
 
 /**
@@ -52,13 +55,13 @@ async function validImages(imgurl) {
  * @param {Object} src	图片地址
  * @param {Object} host	图片前缀，默认使用qn_base_url
  */
-const imageCache = function (vm, src, host) {
+const imageCache = async function (vm, src, host) {
 	host = host || process.uniEnv.qn_base_url
 	let image_url = host + src
 	let image_name = md5Libs.md5(image_url)
 	var arr = Object.keys(vm.vuex_cache);
-	if (vm.vuex_cache && arr.length && arr.includes(image_name) &&
-		validImages(vm.vuex_cache[image_name])) {
+	const result = await validImages(vm.vuex_cache[image_name])
+	if (vm.vuex_cache && arr.length && arr.includes(image_name) && result) {
 		return vm.vuex_cache[image_name]
 	} else {
 		// 本地没有缓存 需要下载