微信小程序考试左右滑动怎么实现

1.使用touchstart、touchmove和touchend方法，唤桐在touchstart方法中，获取当前触点的位置，然后在touchmove方法中，通过比对当前触点位置和先前记录的培埋触点位置，来判断用户是做左滑动还是右滑动；在touchend方法中，可以根据用户滑动的距离和滑动时间确定最终的滑动 *** 作，从而实现左右滑动功能。

2.使用微信小程序APIswiper，可以在wxml中通过添加swiper元素来实现左右滑动。开发者只需要为swiper指定相关参数（如设置每屏显示的内容、滑动时显示的指示器等），就可以实配链蚂现左右滑动的效果。

1、首先第一步，打开微信开发者工具。

2、其次第二步，打开wxml文件，然后在文携大件里先新建一个scroll-view的标签即可。

3、再次第三步，辩轮竖设置这个scroll-into-view滚动的方向设置为x轴，与此同时设置scroll-into-view的值，这个值就是子元素中的id，表示滚动到哪一个元素，如下图所示。

4、接下来就是设置子元素，先新建一个view的子元素，然后设置class和id，并且多设置几个view标签，以便观察效桐信果。

5、最后一步，点击打开模拟器，在下面我们就可以看到滚动的元素，接着就按照我们之前设置的显示就行了。

实现效果如下：

实现左右联动的菜单列表，主要依靠scroll-view的是三个属性：

scroll-top：设置族基竖向滚动条位置（可视雹消区域最顶部到scroll-view顶部的距离）；

scroll-into-view：值应为某子元素id（id不能以数字开头）。设置哪个方向可滚动，则在哪个方向滚兆肆谨动到该元素；

bindscroll：滚动时触发，event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY}

结构图示：

wxml:

js:

数据结构：

如果你还想实现从其他页面，点击按钮跳转到当前页面，并且列表滚动到指定项，此项在可视区域的第一个展示：

wxss:

---