政务网站党风廉政建设栏目/百度一下百度下载

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;

代码如下：

//滚动事件封装：
     scrollTo() {//封装滚动
          this.scroll && this.scroll.scrollTo.apply(this.scroll, arguments)
          //使用apply是因为这个scrollTo方法会接收一些参数的，我们要把这些参数传递到better-scroll的scroll里面，
        },
        scrollToElement() {//滚动到某个元素
          this.scroll && this.scroll.scrollToElement.apply(this.scroll, arguments)
        }
//自定义属性获取：dom.js
export function getData(el, name, val) {//该方法是用来获取data-自定义属性的
  const prefix = 'data-'
  if (val) {
    return el.setAttribute(prefix + name, val)
  }
  return el.getAttribute(prefix + name)
}
//listview.vue中touchStart事件
 onShortcutTouchStart(e){
        let anchorIndex = getData(e.target, 'index')
        this.$refs.listview.scrollToElement(this.$refs.listGroup[anchorIndex],0)
      }