美文网首页
模糊搜索中遇到的坑

模糊搜索中遇到的坑

作者: carlz | 来源:发表于2017-02-28 16:39 被阅读0次

项目中遇到的问题

  1. 拖拽性能问题

  2. 排序问题,在 Safari 中排序不生效

  3. Common.postRequest方法

  4. gesture手势,panflick事件判定标准

  5. 传递过程中需要传递hybridid

  6. 事件传递的组织方式

问题的解决

拖拽性能问题

页面中要通过拖动时间点来确定出行的时间段,在拖动时,发现第一次拖拽dot时有明显的卡顿跳跃现象。查看chrome timeline工具,会发现有这样的提醒。

于是推断是因为在定位中使用position:absolute,通过改变left值来修改dot位置使得页面不停的reflow导致页面卡顿,于是将dot的定位方式修改为通过transform属性来改变位置,这样对页面其他部分不会产生影响。修改后页面中还是会有卡顿现象出现,timeline中依然会提示上面的信息。应该是因为在每次拖动改变时间段后对数据进行筛选再重新渲染的缘故。但是改为transform方式还是对性能有一定的提升。

继续查找卡顿的原因,发现只有在移动左侧dot 时,会有明显的跳跃现象。对left偏移值跟踪处理发现,在拖动时,left偏移值第一次变化大概会有20px左右,问题应该出在这里。仔细回想代码之后,发现是因为获取拖拽距离时,使用的了pageX属性。刚开始计算修改后的位置是计算pageX-gapLeft,由于不会计算拖拽开始时的位置,只是获取鼠标结束点的pageX再赋值给startDot,这样就会出现拖动开始第一次20px的跳跃,因为拖动的位置更偏向中间,而不是dot 点的最左侧。找到问题的原因后,使用clinetX判断起止点的位移差,这个值就是手指拖动时移动端真实距离。再修改后,跳跃问题确实有了很大的改观,但是仔细观察的话还是能发现有卡顿现象,这个是由于事件判定的原因导致的,后面会讲。

排序问题

为了使筛选出符合条件的车站排在最前面,对筛选出的数据进行了排序,但是只判断是否符合时间条件,会出现其他数据一直闪动的现象,因此我选择了对车次的出发时间进行二次判断,这样在被筛选出的车站不发生改变的情况下,其他车站的位置也不会发生变化。使用Array.sort()方法,对数组排序,由于是否在范围内使用boolean值进行判断,因此我判定相等时就直接返回了true/false。在chrome中,排序生效,但是在Safari中,排序无效,查阅相关资料发现,在Safari中,sort方法对boolean值类型的返回值无法进行处理。随后将返回值全部修改为正负值,成功解决了问题。

common.postRequest

由于后端接口是开放给客户端的,因此在页面中无法直接请求这种接口,必须要调用客户端请求服务器的方法才能进行,在QApp框架中,已经定义好了Common.postRequest方法,可以直接调用客户端中的插件。但是必须要在scheme链接中加上hybridid字段,必须是flight_bus_app/flight_ship_app才可以,否则无法调用客户端的方法,可以在测试版的应用上查看注册的插件都有哪些。

手势判定

判断是否为拖拽行为时,会判断持续时间有没有超过300ms,如果没有超过会判定为flick事件,因为pan事件开始的前300ms,事件并不会被触发,导致拖动后的第一次位置变化会有微小的跳跃,但是并不明显,暂时没有很简便的解决方法,除非重写一个新的手势判定标准。

相关文章

  • 模糊搜索中遇到的坑

    项目中遇到的问题 拖拽性能问题 排序问题,在 Safari 中排序不生效 Common.postRequest方法...

  • iOS中的模糊搜索

    项目中经常要做一个模糊搜索(并非使用数据库的)的小功能,于是自己查资料做了一个Demo,感觉挺麻烦的. 一.大致步...

  • 模糊搜索

    【法1】Android基础控件—SearchView 【参考链接】 http://blog.csdn.net/za...

  • 模糊搜索

    http://blog.csdn.net/lianbaixue/article/details/10579117

  • iOS开发中遇到过的坑

    iOS开发中遇到过的坑 iOS开发中遇到过的坑

  • Android Studio 设置代码提示

    遇到的问题:在Android Studio中写代码自动提示只能通过首字母进行提示,没有模糊搜索。 解决办法:Pre...

  • 在List中模糊搜索keyword

  • 搜索的坑--搜索和筛选器(上)

    踩的坑: 1.添加搜索功能 只考虑了模糊词匹配,未考虑分词。 搜索结果排序,跟技术妥协默认为按权重排序:套餐购买数...

  • DSL搜索-扩展

    一、根据前缀去查询 二、模糊搜索 并不是值sql中的模糊查询,而是用户在进行搜索的时候打字错误的现象,搜索引擎会自...

  • mysql的模糊搜索

    模糊查询 在mybatis里面写法 like '%${companyName}%' 而不是'%#{company...

网友评论

      本文标题:模糊搜索中遇到的坑

      本文链接:https://www.haomeiwen.com/subject/fzgxgttx.html