微信小程序
new Date
微信小程序 new Date() 方法在iOS设备上无效的问题的解决方法
javascript
let date = "2021-01-04 00:00"
let now = new Date(date.replace(/-/g, '/'))
小程序分包
小程序的限制
- 分包不能引用主包中的第三方库
- 正常情况下,小程序对代码包的限制是:大小不超过 2M,超过这个大小无法预览,也无法上传代码
- 做了分包加载的情况下,限制是:每个包大小不超过 2M,所有包总共的大小不超过 16M。
分包后项目的构成
- 分包后,小程序项目由 1 个主包 + 多个分包组成:
- 主包:一般只包含项目的启动页面或 TabBar 页面、以及所有分包都需要用到的一些公共资源
- 分包:只包含和当前分包有关的页面和私有资源
分包的加载规则
① 在小程序启动时,默认会下载主包并启动主包内页面 tabBar
页面需要放到主包中
② 当用户进入分包内某个页面时,客户端会把对应分包下载下来,下载完成后再进行展示非 tabBar
页面可以按照功能的不同,划分为不同的分包之后,进行按需下载
json
{
"pages": [
"pages/index/index",
"pages/logs/logs"
],
"subpackages": [
{
"root": "pages/packageA",
"pages": [
"child/child",
"parent/parent"
]
}
]
}
访问路径:packageA 访问子页面 child
js
gotoChild()
{
wx.navigateTo({
url: '/pages/packageA/child/child',
})
}
微信小程序 跳转
js
export const goUrl = (url: string) => {
// switchTab
if (url.startsWith('https')) {
// url 编码
url = encodeURIComponent(url);
wx.navigateTo({
url: `/pages/webview/webview?url=${url}`,
fail: (err) => {
console.log(err, '跳转失败')
}
});
return;
}
wx.switchTab({
url: url,
fail: (err) => {
wx.navigateTo({
url: url,
fail: (err) => {
console.log(err, '跳转失败')
}
});
}
})
}
// url 解码
export const decodeUrl = (url: string) => {
return decodeURIComponent(url);
}
微信小程序 Request 封装
js
class Request {
defaultConfig = {
baseUrl: '',
header: {},
}
interceptor = {
request: (config: any) => {
return config;
},
response: (res: any) => {
return res;
},
}
constructor(
baseUrl: string,
headers = {
'Content-Type': 'application/json',
}
) {
this.defaultConfig.baseUrl = baseUrl;
this.defaultConfig.header = headers;
}
request(url: string, data: any = {}, header: any = {}, method: string = 'GET') {
return new Promise((resolve, reject) => {
let config = {
url: url,
data: data,
header: header,
method: method,
success: (res: any) => {
resolve(res);
},
fail: (err: any) => {
reject(err);
},
};
config.url = this.defaultConfig.baseUrl + url;
config.header = {
...this.defaultConfig.header,
...header,
};
config = this.interceptor.request(config);
wx.request(config);
this.interceptor.response(config);
wx.onNetworkStatusChange((res: any) => {
if (!res.isConnected) {
reject(new Error('网络已断开'));
}
});
});
}
get(url: string, data: any = {}, header: any = {}) {
return this.request(url, data, header, 'GET');
}
post(url: string, data: any = {}, header: any = {}) {
return this.request(url, data, header, 'POST');
}
}
export default Request;
const http = new Request('https://www.baidu.com');
http.interceptor.request((config) => {
console.log('请求拦截器', config);
return config;
})
http.interceptor.response((res) => {
console.log('响应拦截器', res);
return res
});
http.post('/api/user').then((res) => {
console.log(res);
})
格式化接口返回的html内容
js
export const formatHtml = (html: string) => {
let result = html
result = result.replace(/section/gi, "div")
result = result.replace(/data-src/gi, "src")
result = result.replace(/src="data:/gi, 'data-src="data:')
result = result.replace(/<img[^>]*>/gi, function (match: any) {
var match = match.replace(/style/gi, "styles")
return match
})
result = result.replace(/\<img/gi, '<img style="max-width:100%!important;height:auto!important;display:block;" ')
return result
}