front/uni_modules/uview-next/components/u-scroll-list/scrollWxs.wxs

function scroll(event, ownerInstance) {
	// detail中含有scroll-view的信息，比如scroll-view的实际宽度，当前时间点scroll-view的移动距离等
	var detail = event.detail;
	var scrollWidth = detail.scrollWidth;
	var scrollLeft = detail.scrollLeft;
	// 获取当前组件的dataset，说白了就是祸国殃民的腾xun搞出来的垃ji
	var dataset = event.currentTarget.dataset;
	// 此为scroll-view外部包裹元素的宽度
	// 某些HX版本(3.1.18)，发现view元素中大写的data-scrollWidth，在wxs中，变成了全部小写，所以这里需要特别处理
	var scrollComponentWidth = dataset.scrollWidth || dataset.scrollwidth || 0;
	// 指示器和滑块的宽度
	var indicatorWidth = dataset.indicatorWidth || dataset.indicatorwidth || 0;
	var barWidth = dataset.barWidth || dataset.barwidth || 0;
	// 检查是否显示指示器
	var indicator = dataset.indicator;
	// 此处的计算理由为：scroll-view的滚动距离与目标滚动距离(scroll-view的实际宽度减去包裹元素的宽度)之比，等于滑块当前移动距离与总需
	// 滑动距离(指示器的总宽度减去滑块宽度)的比值
	var x = (scrollLeft / (scrollWidth - scrollComponentWidth)) * (indicatorWidth - barWidth);
	setBarStyle(ownerInstance, x, indicator);
}

// 由于webview的无能，无法保证scroll-view在滑动过程中，一直触发scroll事件，会导致
// 无法监听到某些滚动值，当在首尾临界值无法监听到时，这是致命的，因为错失这些值会导致滑块无法回到起点和终点
// 所以这里需要对临界值做监听并处理
function scrolltolower(event, ownerInstance) {
	ownerInstance.callMethod('scrollEvent', 'right');
	// 获取当前组件的dataset
	var dataset = event.currentTarget.dataset;
	// 指示器和滑块的宽度
	var indicatorWidth = dataset.indicatorWidth || dataset.indicatorwidth || 0;
	var barWidth = dataset.barWidth || dataset.barwidth || 0;
	// 检查是否显示指示器
	var indicator = dataset.indicator;
	// scroll-view滚动到右边终点时，将滑块也设置为到右边的终点，它所需移动的距离为：指示器宽度 - 滑块宽度
	setBarStyle(ownerInstance, indicatorWidth - barWidth, indicator);
}

function scrolltoupper(event, ownerInstance) {
	ownerInstance.callMethod('scrollEvent', 'left');
	// 获取当前组件的dataset
	var dataset = event.currentTarget.dataset;
	// 检查是否显示指示器
	var indicator = dataset.indicator;
	// 滚动到左边时，将滑块设置为0的偏移距离，回到起点
	setBarStyle(ownerInstance, 0, indicator);
}

function setBarStyle(ownerInstance, x, indicator) {
	// 只有当 indicator 为 true 时才操作指示器元素
	if (indicator) {
		var barElement = ownerInstance.selectComponent('.u-scroll-list__indicator__line__bar');
		if (barElement) {
			barElement.setStyle({
				transform: 'translateX(' + x + 'px)'
			});
		}
	}
}

module.exports = {
	scroll: scroll,
	scrolltolower: scrolltolower,
	scrolltoupper: scrolltoupper
};