AD:靠谱的微信小程序外包开发

admin

admin

发表于 2017-07-26 21:05:07

摘要:微信小程序开发者社区(www.mntuku.cn)为您提供:微信小程序带字母滑动的listview, js中回调函数
相关的资讯,希望对您有帮助。

微信小程序带字母滑动的listview, js中回调函数

分享者:kingrome2017,来自原文地址一:带字母滑动的listviewwxml !--字母滑动-- view class=letter-position wx:if={{filterType == name}} hidden={{letterShow?true:}} style=z-index:{{Zindex}} ...

分享者:kingrome2017,来自原文地址

一:带字母滑动的listview

wxml

  1. class=letter-position wx:if={{filterType == name}} hidden={{letterShow?true:}} style=z-index:{{Zindex}} catchtouchstart=handlerAlphaTap catchtouchmove=handlerMove catchtouchend=handlerEnd>
  2. class=no-stars star-icon data-loc=star src=../img/no-stars.png>
  3. class=letter wx:for={{groups}} wx:for-item=group data-loc={{group.id}} wx:key=L_{{group.id}}>
  4. {{group.id}}
  5. class=letter no-letter>
  6. #
  1. scroll-into-view={{locationTo}} bindscrolltolower=onscrollLower scroll-y={{trues}} style=height: {{clientHeihgt?clientHeihgt+px:auto}} bindscroll=scroll scroll-top={{scrollTop}} hidden={{favoriteCards.length==0 && starCards.length ==0}}>

js

  1. handlerAlphaTap(e) {
  2. var ap = e.target.dataset.loc; //字母
  3. this.setData({
  4. locationTo: ap
  5. });
  6. var list = this.data.groups;
  7. this.offsetTop = (this.data.clientHeihgt - list.length * 16) / 2;
  8. },
  9. handlerMove(e) {
  10. var _this = this;
  11. var list = this.data.groups;
  12. var moveY = e.touches[0].clientY;
  13. var rY = moveY - this.offsetTop;
  14. if (rY >= 0) {
  15. var index = Math.ceil((rY - 16) / 16);
  16. if (0 <= index && index < list.length) {
  17. _this.setData({
  18. locationTo: list[index].id,
  19. nonwApID: list[index].id,
  20. fly: false,
  21. //nonwAp: list[index]
  22. });
  23. // _this.setData({
  24. // nonwApID:_this.data.nonwAp.id
  25. // });
  26. }
  27. }
  28. },
  29. handlerEnd(e) {
  30. // try{
  31. this.setData({
  32. nonwApID: ,
  33. fly: true,
  34. // locationTo:this.data.nonwAp.id
  35. });
  36. // }catch(e){
  37. // }
  38. var _this = this;
  39. this.setData({
  40. scoTTTTp: e.currentTarget.dataset.scrollTop
  41. });
  42. },

二:js回调函数

回调函数原理:

我现在出发,到了通知你” 
这是一个异步的流程,“我出发”这个过程中(函数执行),“你”可以去做任何事,“到了”(函数执行完毕)“通知你”(回调)进行之后的流程

点击此处转载参考文献


26阅读 | 0评论
你的回应
写文章

8063