滑动绑定事件（基于vue）

需求：滑动右侧字母列表，手指停在哪屏幕就显示哪儿一个字母开头的城市列表

 

 

---

思路

第一步

首先，给右侧字母表得先绑定三个事件。分别是touchstart、touchmove、touchend。

第二步

现在得需要知道手指滑倒的地方对对应的字母是什么。这就需要通过一些计算去得出。有一个解决办法是先计算出A与顶部的距离H，然后在算出每一个字母所占的高度h，然后计算手指与顶部的距离X，然后（X-H) / h。 如果计算出1.5，就代表是第二个字母，2.1就是第三个。

当然以上只是一种想法，具体实现看代码

第三步

具体算法有了，那么怎么实现呢？现在有几个问题需要解决。

1 计算出值后，怎么通过这个值去找到对应的字母？类似与数组，求出了下标，怎么得出这个具体的值

在计算属性中通过for in 循环。 同时需要注意，之前在v-for中因为cities是对象，而现在得出了letters，所