bui实战总结

因为项目进度加快，帮助同事用bui用完成了一个工作流，完成的过程中感觉到难度还是挺高的，涉及到的判断和逻辑比较多。

因为是移动端项目，我选择了bui来完成。

 

问题一..基础知识的问题，本地存储中localstorage.getItem()的使用，在存取数组和对象时，要进行转化，通过JSON.stringify()和

JSON.parse()来实现数据的正确存取。

 

问题二. 下拉刷新控件    bui.pullrefresh()

 

<input type="hidden" id="pages" name="pages" value="">
<input type="hidden" id="pageNum" name="pageNum" value="1"/>


/*
		 * @name: 特殊人员的获取
		 * @Date: 2019-12-04 11.30
		 * @params: url 请求数据的url地址
		 * @return arr 
		 */
		function getSpecialPerson() {
			if($("pages").val()==$("#pageNum").val()){
				bui.hint("已到最底端");
				return false;
			} 
			uiLoading.show();
			 //var pagesize =10;
			//接受老师下面对应的课程数组 getCoursePageInfoData
	     	uiLoading.show();
			bui.ajax({
				url: getRootPath() + '/webchatUser/queryUserHaveDepartment.action',
				async: false,
				data: {
					page:parseInt($("#pageNum").val())+1,
                    limit:10
				},
				method: "POST"
			}).then(function(res) {
				uiLoading.hide();
			/* 	normalPage = res.pageNum+1
				if(res.pages == normalPage){
					bui.hint("已到最底端");
				}else  */
				  //if(res.pages > normalPage){
				//if(res.code==1){
					if(uiPullRefresh){
						if (res.code == 1) { // 为空也要判断是否有值
					 		$("#pages").val(res.pages);
							$("#pageNum").val(res.pageNum);
							specialPersonDate_003 = res.data;
							
							//localStorage.setItem("specialPersonDate_003",JSON.stringify(specialPersonDate_003));
							
							if (specialPersonDate_003.length > 0) {
								//specialPersonArr_003 = [];
								for (var i = 0; i <specialPersonDate_003.length; i++) {
									//组装个对象,将对象push到数组中
									specialPersonArr_003.push({
										"name": specialPersonDate_003[i].srcName+" ("+specialPersonDate_003[i].departmentName+")",
										"image": specialPersonDate_003[i].namePic == null ? '../images/special_person.png' : ctxLocal + specialPersonDate_003[i].namePic,
										"value": specialPersonDate_003[i].autoId,
									});
								}
								//return specialPersonArr_003
								  uiSelectCustom =bui.select({
									id: "#scrollDisplay",
									popup: false,
									type: "checkbox",
									direction: "right",
									data: specialPersonArr_003,
									value: specialPersonArr_003_checked.split(","),
									onChange: function(e) {
										//获取选中的索引   value在这里拿到就是部门名称对应的id串， id1,id2,id3,id4
										var index = uiSelectCustom.index();
										specialPersonArr_003_checked = uiSelectCustom.value();
									},
								})
								uiPullRefresh.reverse();
							}
						}else if(res.code==0){
							
							bui.alert("服务器繁忙。稍后重试");
							uiPullRefresh.fail();
						}
					}else{
						if (res.code == 1) { // 为空也要判断是否有值
							$("#pages").val(res.pages);
							$("#pageNum").val(res.pageNum);
							/* uiPullRefresh.reverse(); */
							
							specialPersonDate_003 = res.data;
							
							//localStorage.setItem("specialPersonDate_003", JSON.stringify(specialPersonDate_003));
							
							if (specialPersonDate_003.length > 0) {
								for (var i = 0; i <specialPersonDate_003.length; i++) {
									//组装个对象,将对象push到数组中
									specialPersonArr_003.push({
										"name": specialPersonDate_003[i].srcName+" ("+specialPersonDate_003[i].departmentName+")",
										"image": specialPersonDate_003[i].namePic == null ? '../images/special_person.png' : ctxLocal + specialPersonDate_003[i].namePic,
										"value": specialPersonDate_003[i].autoId,
									});
								}
								return specialPersonArr_003
							}
						}else if(res.code==0){
							bui.alert("服务器繁忙。稍后重试");
							uiPullRefresh.fail();
						}
					}
				//}
				  
			}, function(res, status) {
				bui.alert("服务器繁忙，稍后重试");
			})
		}

 * uiPullRefresh.reverse();这里需要注意的是位置，必须是元素渲染完成后，通过uiPullRefresh.reverse()实现下拉刷新。