这里写目录标题
- 获取机型 uni.getSystemInfo
- 上下拉动滚动条时卡顿、慢 overflow-scrolling:touch;
- 长时间按住页面出现闪退 -webkit-touch-callout:none;
- iphone 及 ipad 下输入框默认内阴影 -webkit-appearance:none;
- 1px 像素使用伪类元素模拟边框,使用 transform 缩放
- click 的 300ms 延迟问题 fastclick库解决
- ios键盘唤起,键盘收起后页面不归位 在失去焦点的时候给一个事件
- h5底部输入框被键盘遮挡问题 document.body.scrollTop = document.body.scrollHeight
- iOS 系统中文输入法输入英文时,字母之间可能会出现一个六分之一空格可以通过正则去掉
- RESTful接口
获取机型 uni.getSystemInfo
原生 :navigator.userAgent
uniapp; uni.getSystemInfo({
success(res) {
console.log(res.brand) //手机牌子
console.log(res.model) //手机型号
console.log(res.screenWidth) //屏幕宽度
console.log(res.screenHeight) //屏幕高度
}
});
上下拉动滚动条时卡顿、慢 overflow-scrolling:touch;
长时间按住页面出现闪退 -webkit-touch-callout:none;
iphone 及 ipad 下输入框默认内阴影 -webkit-appearance:none;
1px 像素使用伪类元素模拟边框,使用 transform 缩放
click 的 300ms 延迟问题 fastclick库解决
在document.body 上绑定 touchstart 和 touchend
其中,touchstart 用于记录当前点击元素的targetElement。
touchend 阻止默认事件,通过DOM自定义事件模拟一个click事件
ios键盘唤起,键盘收起后页面不归位 在失去焦点的时候给一个事件
h5底部输入框被键盘遮挡问题 document.body.scrollTop = document.body.scrollHeight
const ua = navigator.userAgent;
const iOS = /iPad|iPhone|iPod/.test(ua);
const input = document.querySelector('#input');
input.addEventListener('focus', () => {
setTimeout(() => {
if (iOS) {
if (!/OS 11_[0-3]\D/.test(ua)) {
document.body.scrollTop = document.body.scrollHeight;
}
} else {
input.scrollIntoView(false);
}
}, 300);
});
iOS 系统中文输入法输入英文时,字母之间可能会出现一个六分之一空格可以通过正则去掉
this.value = this.value.replace(/\u2006/g, '');
RESTful接口
这种接口风格,可以大幅的简化我们的接口设计,一个接口地址对应不同的post,get…方法实现不同的操作
我们所做的大多数操作都是对数据库的四格操作 “增删改查” 对应到我们的接口操作分别是:
post 插入新数据
delete 删除数据
put 修改数据
get 查询数据
注意:这里是我们约定,并非这些动作只能干这件事情。从表层来说,除get外的其他方法,没有什么区别,都是一样的。从深层来说包括 get 在内的所有方法都是一模一样的,没有任何区别。但是,我们约定,每种动作对应不同的操作,这样方便我们统一规范我们的所有操作。
假设,我们的接口是 /api/v1/love 这样的接口,采用 RESTful 接口风格对应操作是如下的:
1、get 操作 /api/v1/love:获取 /api/v1/love 的分页列表数据,得到的主体,将是一个数组,我们可以用数据来遍历循环列表
2、post 操作 /api/v1/love:我们会往 /api/v1/love 插入一条新的数据,我们插入的数据,将是JOSN利用对象传输的。
3、get 操作 /api/v1/love/1:我们获取到一个 ID 为 1 的的数据,数据一般为一个对象,里面包含了 1 的各项字段信息。
4、put 操作 /api/v1/love/1:我们向接口提交了一个新的信息,来修改 ID 为 1 的这条信息
5、delete 操作 /api/v1/love/1:我们向接口请求,删除 ID 为 1 的这一条数据
由上述例子可知,我们实现了5种操作,但只用了两个接口地址, /api/v1/love 和 /api/v1/love/1 。所以,采用这种接口风格,可以大幅的简化我们的接口设计。