uniapp左右滑动切换月份

uniapp左右滑动切换月份_第1张图片

 左右滑动触发事件

给组件绑定事件,主要利用组件的触摸开始和触摸结束事件来实现:

2,声明初始化点击位置变量startX

data() {
		return {
			list:[],
			pageNum:1,
			pageSize:10,
 
			//初始化点击位置的x坐标
			startX:0,
		}
	},

3,利用开始触摸和结束触摸的位置的x坐标来判断是左滑还是右滑。

    /**
		* 触摸开始
		* @param {Object} e
		*/
	   touchStart: function (e) {
			if (e.touches.length == 1) {
				//设置触摸起始点水平方向位置
				this.startX=e.touches[0].clientX;
			}
		},
		/**
		 * 触摸结束
		 * @param {Object} e
		 */
		touchEnd: function (e) {
			if (e.changedTouches.length == 1) {
				//手指移动结束后水平位置
				var endX = e.changedTouches[0].clientX;
				let diff = endX-this.startX;
				if(Math.abs(diff)>20){
					if(diff>0){
						

你可能感兴趣的:(uni-app)