页面常用的尺寸
PC:内容区宽度:
早期:60 980 1000
1200 1380
字体大小:
12px 14px
16px 18px
常用字体:“微软雅黑”
Arial(针对英文)
H5: 750(大多设计稿的宽度)
暂时保留页面状态,例:分页、选项卡
sessionStorage存储实现
一般情况下请求数据流程
加载过程中有loading动画,默认至少1秒(不然一闪而过也会给用户不好的体验),请求完毕,loading消失,有数据则渲染页面,没数据显示提示内容
像图片这种加载不出的要有默认样式(背景色、alt属性之类的)
浏览器的记住密码该如何解决
原理是匹配type和name属性
解决办法是在input type="password"输入框中加上autoComplete = "new-password"属性
火狐不兼容(多写一个input隐藏即可)
分页器(react)
1、这个分页器必定是个单独的组件
2、分页器这个组件在被动态渲染的时候是没有生命周期的,所以初始化数据要放在父组件中,用于挂载时发起ajax请 求初始化页面
3、页码改变时调用父组件的ajax请求事件
请求接口的值直接使用参数,因为使用state的值获取不到最新的数据
将值存到sessionStorage中,可以在页面关闭前暂时保存页码
4、页面的显示,一般就是三种(loading动画、内容为空的提示、加载出来的数据)
两个状态:
loadFlag:loading动画的状态,默认false
nullFlag:提示的开关,默认false
数据请求逻辑:
将loading打开,然后发起ajax请求
请求后的结果有两个
长度大于0,之后就可以修改要显示的数据和关闭loading
长度不大于0,关闭loading,打开提示
5、但多个页面同时使用这个分页器时,我们就需要提前判断一下
方法:(暂时就一种)
父组件传一个值,用这个值去判断
与安卓、ios进行联调
videoOpen(obj){
var oPar = obj.parents('li');
var videoUrl = oPar.data('video')+'';
if(P.userAgent()){
var videoObj = {
play_video:videoUrl
};
var str = JSON.stringify(videoObj);
document.location = "y.com?"+str;
}else {
var videoObj = {
url:videoUrl
};
var str = JSON.stringify(videoObj);
window.myjs.doAction("play_video",str);
}
}