2021-07-27 今天的工作小结

一、今天依然在美化和优化一键报案页面。从用户体验的角度来看，虽然大部分情况下自动定位功能 是定位成功的，然后输入框 上面也会自动输入定位好的地址在上面。输入框右侧的地图打开按钮，点击后会打开地图，然后用户点击地图上会自动选择地址并关闭地图。但考虑了一种 情况 ，万一用户又通过输入框 右边的的按钮打开了地图，看了看，又不想改地址了，这时候用户可能会不知道 怎么操作了。所以最后在地图页面加了一个按钮。

二、多数情况下做ajax请求的时候 之前是自己在fastmock网上做模拟接口；对于一些需要返回数据的，是很好用。但是一些简单的，比如返回1或者返回0的时候我们需要做不同的处理，如下代码 ：
比如请求结果返回了个res

success:function(res){
	if(res==1){   //执行一些操作    }
	if(res==2){   //执行一些操作    }  
}

我们在测试的时候 ，作为前端开发，可以自己在这里手动模拟接口，不需要 等 后端返回。直接在if前面给res赋值 就能模拟出结果，以方便进行功能测试 。

success:function(res){
	res=1;  //直接赋值即可
	if(res==1){   //执行一些操作    }
	res=2;  //直接赋值即可
	if(res==2){   //执行一些操作    }  
}

三、在做一些ajax调用 的时候 ，要考虑到异常的情况，比如调用失败，提示用户。在数据加载前也可以使用一个挡板来提示用户"加载中" 严格的来说，我想任何时候的ajax调用 都应该要有处理，最好的方法是做一个弹窗div，用一个函数(比如

<div>
<h5 id="title"></h5>
<p id="message"></p>
<button id="btn">确定</button>
</div>

//定义一个tips函数，
function tips(title,message,fun){
document.getElementById("title").innerText=title;
document.getElementById("message").innerText=message;
if(fun){
fun();   //如果传了第三个参数（函数）则执行它。
}
}

形参来控制里面的内容 显示，比如ajax请求异常。可以在error里面调用tips()传入三个参数来进行操作。

tips("温馨提示","网络请求失败，点击确定按钮返回首页",function(){
	document.getElementById("btn").onClick(function(){
		window.location.href="../index.html"
	})
})

这里是传了三个参数，分别是标题 提示的内容 和 点击确定按钮后要执行什么操作。

前端开发需要更多的从用户的角度去测试自己写的功能的各种情况，bug是改不完的，但bug要越来越少！

补充 ，这个需求还有个问题，要做一个 功能， 获取数据，如果获取到的数据是1或者2，则重新调用它自己。开始用的定时器，发现其实问题挻 多，setInterval()其实是异步的功能函数 （百度了一下 说是，暂时没去求证）反正是执行的很不稳定。一会快一会慢。然后换成了setTimeout()，延时器。

if(reportData.acceptFlag==="1"||reportData.acceptFlag==="2"){
                // 延时10秒后重新调用一下自己。然后把次数加1
                var timeout=setTimeout(function(){
                    accidentStatus();
                    count++;
                    console.log(count)
                },10000)
                if(count=6){
                    // 显示是否继续按钮；因为需求是满1分钟后/10秒调用一次，所以是6次，一分钟后显示按钮，所以不能用大于
                    // 应该用等于来判断 ；==6的时候显示按
                }
                if(count>=6){
                    // 满10分钟了，清除定时器，强制退出或者跳转首页
                    clearTimeout(timeout);
                    window.location.href="http://www.baidu.com"
                }
            }else{
                console.log("成功，这里跳转到小程序")
            }