zoukankan      html  css  js  c++  java
  • 歌手右侧快速入口ABCD....

    1.通过v-for将右侧内容渲染出来,并绝对定位到右侧

    2.给每个li绑定touchStart事件,并绑定自定义属性data-index=index;

    3.点击每个li,通过e来获取所绑定的自定义属性中的index;

    4.封装scrll中的scrllTo和scrollTlElement方法,

    5.给滚动盒子加:ref="listview",里面变化的绑定:ref=listGroup;

    6.让listGroup滚动到点击的锚点索引anchorIndex;

    代码如下:

     1 //滚动事件封装:
     2      scrollTo() {//封装滚动
     3           this.scroll && this.scroll.scrollTo.apply(this.scroll, arguments)
     4           //使用apply是因为这个scrollTo方法会接收一些参数的,我们要把这些参数传递到better-scroll的scroll里面,
     5         },
     6         scrollToElement() {//滚动到某个元素
     7           this.scroll && this.scroll.scrollToElement.apply(this.scroll, arguments)
     8         }
     9 //自定义属性获取:dom.js
    10 export function getData(el, name, val) {//该方法是用来获取data-自定义属性的
    11   const prefix = 'data-'
    12   if (val) {
    13     return el.setAttribute(prefix + name, val)
    14   }
    15   return el.getAttribute(prefix + name)
    16 }
    17 //listview.vue中touchStart事件
    18  onShortcutTouchStart(e){
    19         let anchorIndex = getData(e.target, 'index')
    20         this.$refs.listview.scrollToElement(this.$refs.listGroup[anchorIndex],0)
    21       }
  • 相关阅读:
    django email用法
    django ImageField用法
    django集成微博内容
    python读写zip文件
    读写文件
    404渲染
    bzoj1297 / P4159 [SCOI2009]迷路
    bzoj1009 / P3193 [HNOI2008]GT考试
    poj2115 C Looooops(exgcd)
    bzoj1407 / P2421 [NOI2002]荒岛野人(exgcd)
  • 原文地址:https://www.cnblogs.com/yangguoe/p/9455075.html
Copyright © 2011-2022 走看看