uni.chooseImage选取图片造成应用刷新的问题

uni.chooseImage选取图片造成应用刷新的问题

在uniapp 做选择文件的功能 有部分手机选择完后 会触发生命周期里的方法 会造成页面数据重新渲染，数据更新，造成图片选择不成功等问题，防止这种做法 我们有两种方式

一. 不要在onshow生命周期填写相关的函数操作，在onload做函数处理，不过这个方法有个弊端 就是当这个页面不是二级页面，就没有办法进行数据的实时更新，必须退出应用才会重新更新数据，不然就是一直读取之前onload请求的数据

二. 通过定义一个布尔值来判断是否为选择图片，因为的话，选择图片虽然会触发onshow方法，但不会把data的数据给重置了，所以这里我们还是可以拿到对应的数据

1.在data里定义一个布尔值，默认为false；

data() {
	return {
		isChoseImg: false
	}
},

2.在onshow生命周期里面加上一个条件判断，判断是否为选择图片触发，还是页面打开触发

onShow: function() {
	if (!this.isChoseImg) {
		const token = uni.getStorageSync('token')
		if (token) {
			this.getInfo()
		} else {
			const routes = getCurrentPages();
			const curRoute = routes[routes.length - 1].route
			if (curRoute !== 'pages/Login/Login') {
				uni.navigateTo({
					url: 'pages/Login/Login'
				})
			}
		}
	}
},

3.在选择文件的函数做一下布尔处理，在触发这个函数的时候，把状态改为true,表示已经开始选择中，页面不可触发onshow方法。然后在选择成功和取消选择两个行为中把状态改为false，表示选择已经结束，页面可以触发onshow方法

upload(type) {
	this.isChoseImg = true
	uni.chooseImage({
		count: 1,
		sizeType: ['original', 'compressed'],
		sourceType: ['album'],
		success: (res) => {
			this.isChoseImg = false
			uni.uploadFile({
				url: 'https://file.cs08.cn/file/uploadUtil',
				header: {
					"Token": this.userToken
				},
				filePath: res.tempFilePaths[0],
				name: 'file',
				success: res => {
					let data = JSON.parse(res.data) //返回的是字符串，需要转成对象格式，打印data如下图
					if (data.code == 200) {
						if (type == 'photo') {
							this.$set(this.formData, 'DoctorImgUrl', data.data.url)
						}
					} else {
						uni.showToast({
							icon: 'none',
							title: data.msg
						})
					}

				},
				fail: () => {}
			})
		}
	})
},