微信小程序开发问题兼容,以及公共方法汇总
Post on 2021-10-27
116
0
目录
兼容问题
iphone xs Max new Date()兼容问题
在iphone xs Max手机上当进行 new Date("2020-05-15 18:56:00")
时,会返回NaN
解决方法:在操作日期前添加一个日期的过滤
将"2020-05-15 18:56:00"
改为"2020/05/15 18:56:00"
格式
这里写的是我自己用的过滤,请按实际情况进行修改
if(typeof times == "string" && times.indexOf("-") != -1 && times.split("-").length == 3){
times = times.replace(/-/g, '/').replace(/T/g, " ")
}
iphone xs Max 空白处显示了上一个界面内容的问题
在iphone xs 手机上,圈圈的空白处会显示之前界面的内容
解决方法:每个界面都需要设置一个高度100vh
并且宽度100vw
的最顶层view
待补充…
公共方法汇总
节流过滤方法
用于跳转和请求按钮的节流过滤方法,防止多次点击跳转按钮导致小程序会出现额外层次
//节流函数
throttle(fn,gapTime) {
if (gapTime == null || gapTime == undefined) {
gapTime = 1500
}
let _lastTime = null
return function () {
let _nowTime = + new Date()
if (_nowTime - _lastTime > gapTime || !_lastTime) {
// 将this和参数传给原函数
fn.apply(this,arguments)
_lastTime = _nowTime
}else{
console.log("节流过滤");
}
}
},
使用方法:
functionName: throttle(function (e) {
//逻辑代码
}, 1000),
封装请求方法
公共的数据请求方法封装
//封装请求方法
requestFn: function(obj) {
let that = this;
let url = obj.url || {};
let data = obj.data || {};
let header = obj.header || {};
let method = obj.method || "GET";
let dataType = obj.dataType || "json";
let responseType = obj.responseType || "text";
let successFn = obj.success || function(res) {};
let failFn = obj.fail || function(res) {
wx.showToast({
title: '网络请求失败',
})
};
let loding = obj.loding || "true";
if(loding=="true"){
wx.showLoading({
title: '请求中',
mask: true
})
}
if (this.showMentionTimer != null) {
clearTimeout(this.showMentionTimer);
}
this.showMentionTimer = setTimeout(function() {
console.log("hideLoading")
wx.hideLoading()
}, 2 * 1000)
let completeFn = obj.complete || function(res) {};
wx.request({
url: url,
data: data,
header: header,
method: method,
dataType: dataType,
responseType: responseType,
success: (res) => {
if (this.showMentionTimer != null) {
clearTimeout(this.showMentionTimer);
}
if(loding=="true"){
console.log("hideLoading")
wx.hideLoading()
}
if (!res.data.resType) {
if (res.data.code == 401) {
wx.removeStorage({
key: 'token',
success(res) {
}
})
wx.showToast({
title: '登录失效,重新登录',
icon: "none"
})
return;
}
}
successFn(res);
},
fail: (res) => {
if (this.showMentionTimer != null) {
clearTimeout(this.showMentionTimer);
}
console.log("hideLoading")
wx.hideLoading()
failFn(res)
},
complete: (res)=> {
completeFn(res)
},
})
},
使用方法:
POST
requestFn({
url: "请求地址",
header: {
token: token,
},
method: "POST",
data: {
data: this.data,
},
success: (res) => {
console.log(res);
},
fail: (res) => {
console.log("error",res)
},
complete: (res) => {
console.log("complete",res)
},
})
GET
requestFn({
url: "请求地址",
method: "GET",
data: {
token: token,
data: this.data,
},
success: (res) => {
console.log(res);
},
fail: (res) => {
console.log("error",res)
},
complete: (res) => {
console.log("complete",res)
},
})
日期格式返回
可以按照格式进行日期字符串的返回
Date.prototype.format = function(fmt) {
var o = {
"M+": this.getMonth() + 1, //月份
"d+": this.getDate(), //日
"h+": this.getHours(), //小时
"m+": this.getMinutes(), //分
"s+": this.getSeconds(), //秒
"q+": Math.floor((this.getMonth() + 3) / 3), //季度
"S": this.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
}
for (var k in o) {
if (new RegExp("(" + k + ")").test(fmt)) {
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
}
}
return fmt;
}
使用方法:
new Date().format("yyyy-MM-dd hh:mm:ss")
手机号格式验证
验证手机号是否正确
(/^1[3456789]\d{9}$/.test(this.data.phone))
//or
(/^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1})|(19[0-9]{1}))+\d{8})$/.test(this.data.phone))
开发时遇到的bug
待补充…
暂无评论