小程序自定义索引菜单_javascript技巧_

      {{item.indexLetter}}                 {{items.enName}}{{items.cnName}}               

function throttle(fn, interval) {     var enterTime = 0;//触发的时间     var gapTime = interval || 300 ;//间隔时间，如果interval不传，则默认300ms     return function() {       var context = this;       var backTime = new Date();//第一次函数return即触发的时间       if (backTime - enterTime > gapTime) {         fn.call(context,arguments);         enterTime = backTime;//赋值给第一次触发的时间，这样就保存了第二次触发的时间       }     }; }; data:{       brandIndexList:{             brandGroupList:[                 {                     brandList:[                         {brandId:1, cnName: "爱马仕A", enName: "Hermes", indexLetter: "A"}                     ],                     indexLetter: "A"                 },                 {                     brandList:[                         {brandId:2, cnName: "爱马仕B", enName: "Hermesss", indexLetter: "B"}                     ],                     indexLetter: "B"                 },                 {                     brandList:[                         {brandId:3, cnName: "爱马仕G", enName: "Hermes", indexLetter: "G"}                     ],                     indexLetter: "G"                 },                 {                     brandList:[                         {brandId:4, cnName: "爱马仕M", enName: "Hermesss", indexLetter: "M"}                     ],                     indexLetter: "M"                 },                 {                     brandList:[                         {brandId:5, cnName: "爱马仕P", enName: "Hermesss", indexLetter: "P"}                     ],                     indexLetter: "P"                 },                 {                     brandList:[                         {brandId:6, cnName: "爱马仕V", enName: "Hermesss", indexLetter: "V"}                     ],                     indexLetter: "V"                 }             ],             indexLetterList: ["A", "B", "G", "M", "P", "V"]         }，    letterNodes:[],//索引菜单 全部节点位置    letterIndex:0, }   onReady(){               let self = this;         let indexLetterList = self.data.brandIndexList.indexLetterList,             letterNodes = self.data.letterNodes,             nodes = '.ancehor-',             arrs = [];             // 获取所有索引锚点节点             indexLetterList.forEach((item)=>{                 arrs.push(nodes+item);                 if(arrs.length == indexLetterList.length){                     self.getDoms(arrs.join(','),(res)=>{                         letterNodes = res.map((item)=>{return item.top-88});                         self.setData({                             letterNodes:letterNodes                         });                     });                     wx.hideLoading();                 }             });     },     // 动态获取节点      getDoms(node,success){         let self = this,             query = wx.createSelectorQuery();             setTimeout(()=>{                 query.selectAll(node).boundingClientRect((res)=>{                     success && success(res);                 }).exec()             },1000);     },      // 索引菜单点击滚动     letterClick(e){         let self = this,             index = e.currentTarget.dataset.index,             letterNodes = self.data.letterNodes;             wx.pageScrollTo({                 scrollTop: letterNodes[index]             })     },      // 页面滚动     onPageScroll:throttle(function(e){      let self = this,          scrollTop = e[0].scrollTop,          stickyTop = self.data.stickyTop,          letterNodes = self.data.letterNodes,          showSticky = self.data.showSticky,          letterIndex = self.data.letterIndex;         // 显示右侧索引         if(scrollTop>=stickyTop){             showSticky = true;         }else{             showSticky = false;         }         //滚动定位索引         letterNodes.forEach((item,index)=>{             if(scrollTop>=item){                 letterIndex = index;                 // console.log(index)             }         })                // console.log(scrollTop)         self.setData({             showSticky:showSticky,             letterIndex:letterIndex         });     },10)