@tarojs/components
Version:
Taro 组件库。
1 lines • 3.59 kB
JavaScript
import{r as registerInstance,c as createEvent,h,H as Host,g as getElement}from"./index-5bd7cbab.js";import{c as classnames}from"./index-cd1a2d33.js";import{d as debounce}from"./index-cad8203e.js";var indexCss="taro-scroll-view-core{display:block;width:100%;-webkit-overflow-scrolling:auto}taro-scroll-view-core::-webkit-scrollbar{display:none}.taro-scroll-view__scroll-x{overflow-x:scroll;overflow-y:hidden}.taro-scroll-view__scroll-y{overflow-x:hidden;overflow-y:scroll}";function easeOutScroll(l,o,r){if(l===o||typeof l!=="number"){return}var e=o-l;var t=500;var s=Date.now();var c=o>=l;function i(l,o,r,e){return r*l/e+o}function n(){l=i(Date.now()-s,l,e,t);if(c&&l>=o||!c&&o>=l){r(o);return}r(l);requestAnimationFrame(n)}n()}var ScrollView=function(){function l(l){var o=this;registerInstance(this,l);this.onScroll=createEvent(this,"scroll",3);this.onScrollToUpper=createEvent(this,"scrolltoupper",3);this.onScrollToLower=createEvent(this,"scrolltolower",3);this.scrollX=false;this.scrollY=false;this.upperThreshold=50;this.lowerThreshold=50;this.scrollWithAnimation=false;this.handleScroll=function(l){if(l instanceof CustomEvent)return;var r=o.el,e=r.scrollLeft,t=r.scrollTop,s=r.scrollHeight,c=r.scrollWidth;o._scrollLeft=e;o._scrollTop=t;o.upperAndLower();o.onScroll.emit({scrollLeft:e,scrollTop:t,scrollHeight:s,scrollWidth:c})};this.upperAndLower=debounce((function(){var l=o.el,r=l.offsetWidth,e=l.offsetHeight,t=l.scrollLeft,s=l.scrollTop,c=l.scrollHeight,i=l.scrollWidth;var n=Number(o.lowerThreshold);var a=Number(o.upperThreshold);if(!isNaN(n)&&(o.scrollY&&e+s+n>=c||o.scrollX&&r+t+n>=i)){o.onScrollToLower.emit({direction:o.scrollX?"right":o.scrollY?"bottom":""})}if(!isNaN(a)&&(o.scrollY&&s<=a||o.scrollX&&t<=a)){o.onScrollToUpper.emit({direction:o.scrollX?"left":o.scrollY?"top":""})}}),200)}l.prototype.watchScrollLeft=function(l){var o=this;var r=Number(l);if(this.scrollX&&!isNaN(r)&&r!==this._scrollLeft){if(this.scrollWithAnimation){easeOutScroll(this._scrollLeft,r,(function(l){return o.el.scrollLeft=l}))}else{this.el.scrollLeft=r}this._scrollLeft=r}};l.prototype.watchScrollTop=function(l){var o=this;var r=Number(l);if(this.scrollY&&!isNaN(r)&&r!==this._scrollTop){if(this.scrollWithAnimation){easeOutScroll(this._scrollTop,r,(function(l){return o.el.scrollTop=l}))}else{this.el.scrollTop=r}this._scrollTop=r}};l.prototype.watchScrollIntoView=function(l){var o;if(typeof l==="string"&&l){(o=document.querySelector("#"+l))===null||o===void 0?void 0:o.scrollIntoView({behavior:"smooth",block:"center",inline:"start"})}};l.prototype.componentDidLoad=function(){var l=this;var o=this,r=o.scrollY,e=o.scrollX,t=o.scrollWithAnimation;var s=Number(this.mpScrollTop);var c=Number(this.mpScrollLeft);if(r&&!isNaN(s)){if(t){easeOutScroll(0,s,(function(o){return l.el.scrollTop=o}))}else{this.el.scrollTop=s}this._scrollTop=s}if(e&&!isNaN(c)){if(t){easeOutScroll(0,c,(function(o){return l.el.scrollLeft=o}))}else{this.el.scrollLeft=c}this._scrollLeft=c}};l.prototype.render=function(){var l=this,o=l.scrollX,r=l.scrollY;var e=classnames({"taro-scroll-view__scroll-x":o,"taro-scroll-view__scroll-y":r});return h(Host,{class:e,onScroll:this.handleScroll},h("slot",null))};Object.defineProperty(l.prototype,"el",{get:function(){return getElement(this)},enumerable:false,configurable:true});Object.defineProperty(l,"watchers",{get:function(){return{mpScrollLeft:["watchScrollLeft"],mpScrollTop:["watchScrollTop"],mpScrollIntoView:["watchScrollIntoView"]}},enumerable:false,configurable:true});return l}();ScrollView.style=indexCss;export{ScrollView as taro_scroll_view_core};