uniapp多端问题总结

页面跳转相关

1、页面跳转传参报错

• 问题： 小程序报错 SyntaxError: Unexpected end of JSON inputat JSON.parse ()
  
• 原因：是由于JSON.parse无法识别某些url中的特殊字符比如&等特殊符号。
• 解决办法：
  原来代码：

// 跳转所属专区
clickToTab(item) {
		this.$common._jumpToUrl('./modularDetail', 0, { curModular: JSON.stringify(item) })
}

onLoad(data) {
	this.curModular = data.curModular ? JSON.parse(data.curModular) : {},
}		

现在代码：

// 跳转所属专区
clickToTab(item) {
	// #ifndef MP-WEIXIN
	this.$common._jumpToUrl('./modularDetail', 0, { curModular: JSON.stringify(item) })
	// #endif
	// #ifdef MP-WEIXIN
	this.$common._jumpToUrl('./modularDetail', 0, { curModular: encodeURIComponent(JSON.stringify(item)) })
	// #endif
}

onLoad(data) {
	// #ifndef MP-WEIXIN
	this.curModular = data.curModular ? JSON.parse(data.curModular) : {}
	// #endif
	// #ifdef MP-WEIXIN
	this.curModular = data.curModular ? JSON.parse(decodeURIComponent(data.curModular)) : {}
	// #endif
}		

2、路由跳转时参数为null 或者 undefined

• 问题：App和H5没问题，小程序报错
• 原因：小程序会把参数转成字符串
• 解决办法：
  在封装的接口请求中utils->required.js中添加判断，遍历参数把为null的值都删除

import {baseUrl} from "./config.js"
import $common from '@/common/common.js'
let content_type = 'application/json;charset=UTF-8';
export const request = function(url_adress, method, data) {
	return new Promise((resolve, reject) => {
		let url = baseUrl + url_adress;
		let headers = {
			"content-type": content_type,
		}
		if ($common._getStorage('token')) {
			headers.Authorization = 'Bearer ' + $common._getStorage('token')
		}
		if (typeof data == "object") {
			for (let key of Object.keys(data)) {
				if (data[key] == null || data[key] == undefined) {
					delete data[key];
				}
				if (data[key] instanceof Array) {
					const arr = [];
					const list = data[key];
					for (let listElement of list) {
						const abj = requestParamHandler(listElement);
						abj && arr.push(abj);
					}
					data[key] = arr;
				}
			}
		}
		uni.request({
			withCredentials:true,
			url: url,
			method: method,
			header: headers,
			data: data,
			success: res => {
				if(res.data.code === 200) {
					resolve(res.data)
				} else if (res.data.code === 401) {
					let routes = getCurrentPages();
					let curRoute = routes[routes.length - 1].$page.fullPath // 获取当前页面路由，也就是最后一个打开的页面路由
					$common._showModal('温馨提示', '请先去登录', '取消', '确定').then(() => {
						$common._removeStorage('token')
						// let path = curRoute.indexOf('redirect=') > -1 ? `/pages/login/index?redirect=${curRoute}` : `/pages/login/index`
						let path = `/pages/login/index?redirect=${curRoute}`
						$common._jumpToUrl(path)
					})
				}else{
					if (res.data.msg) {
						$common._showToast(res.data.msg)
					}
					reject(res.data)
				}
			},
			fail: err => {
				console.log('err', err);
			},
			complete: res => {
			}
		})
	});
	
}

3、订单倒计时方法，苹果手机时间显示NAN，安卓没有问题

• 原因：苹果时间戳获取类型是2022/12/26 13:44:40，安卓手机获取格式2022-12-26 13:44:40
• 解决办法：字符串替换改成苹果类型，这样都不会报错

// 订单倒计时 createTime-当前时间 expireTime-结束时间
export function timeDifference(createTime, expireTime){
   createTime = createTime.replace(/\-/g, '/')
   expireTime = expireTime.replace(/\-/g, '/')
   //截取字符串，得到日期部分"2009-12-02",用split把字符串分隔成数组
   var begin1=createTime.substr(0,10).split("/");
   var end1=expireTime.substr(0,10).split("/");
   //将拆分的数组重新组合，并实例成化新的日期对象
   var date1=new Date(begin1[1] + '/' + begin1[2] + '/' + begin1[0]);
   var date2=new Date(end1[1] + '/' + end1[2] + '/' + end1[0]);
   //得到两个日期之间的差值m，以分钟为单位
   //Math.abs(date2-date1)计算出以毫秒为单位的差值
   //Math.abs(date2-date1)/1000得到以秒为单位的差值
   //Math.abs(date2-date1)/1000/60得到以分钟为单位的差值
   var m= parseInt(Math.abs(date2-date1)/1000/60);
   //小时数和分钟数相加得到总的分钟数
   //createTime.substr(11,2)截取字符串得到时间的小时数
   //parseInt(createTime.substr(11,2))*60把小时数转化成为分钟
   var min1=parseInt(createTime.substr(11,2))*60+parseInt(createTime.substr(14,2));
   var min2=parseInt(expireTime.substr(11,2))*60+parseInt(expireTime.substr(14,2));
   var second1 = parseInt(createTime.substr(17,2));
   var second2 = parseInt(expireTime.substr(17,2));
   //两个分钟数相减得到时间部分的差值，以分钟为单位
   var n= second1 > second2 ? min2-min1-1 : min2-min1;
   //将日期和时间两个部分计算出来的差值相加，即得到两个时间相减后的分钟数
   return m + n
}

/**
* JS 计算两个时间间隔多久（时分秒）
* @param startTime "2019-10-23 15:27:23"
* @param endTime "2019-10-23 15:27:55"
* @return 1天2时3分5秒
*/
export function twoTimeInterval(startTime, endTime, str) {
 // 开始时间
 let d1 = startTime.replace(/\-/g, "/");
 let date1 = new Date(d1);

 // 结束时间
 let d2 = endTime.replace(/\-/g, "/");
 let date2 = new Date(d2);

 // 时间相差秒数
 let dateDiff = date2.getTime() - date1.getTime();

 // 计算出相差天数
 let days = Math.floor(dateDiff / (24 * 3600 * 1000));

 // 计算出小时数
 let residue1 = dateDiff % (24 * 3600 * 1000); // 计算天数后剩余的毫秒数
 let hours = Math.floor(residue1 / (3600 * 1000));

 // 计算相差分钟数
 let residue2 = residue1 % (3600 * 1000); // 计算小时数后剩余的毫秒数
 let minutes = Math.floor(residue2 / (60 * 1000));

 // 计算相差秒数
 let residue3 = residue2 % (60 * 1000); // 计算分钟数后剩余的毫秒数
 let seconds = Math.round(residue3 / 1000);

 let returnVal = ''
 if (str === '分') {
   // 返回到分钟
   returnVal =
      ((days <= 0) ? "" : days+"天") +
      ((hours <= 0) ? "" : hours +"时") +
      ((minutes <= 0) ? "" : minutes+"分")
 } else {
   returnVal = ((days <= 0) ? "" : days+"天") +
     ((hours <= 0) ? "" : hours +"时") +
     ((minutes <= 0) ? "" : minutes+"分") +
     ((seconds <= 0) ? "" : seconds+"秒");
 }
 return returnVal;

}

组件

api

1. uni.requestPayment 支付。代码参考