UNPKG

dtd

Version:

根据数梦工场视觉规范打造的组件库,感谢react-components和ant design

1 lines 2.64 kB
import _extends from"babel-runtime/helpers/extends";import _classCallCheck from"babel-runtime/helpers/classCallCheck";import _createClass from"babel-runtime/helpers/createClass";import _possibleConstructorReturn from"babel-runtime/helpers/possibleConstructorReturn";import _inherits from"babel-runtime/helpers/inherits";import*as React from"react";import Animate from"rc-animate";import addEventListener from"rc-util/es/Dom/addEventListener";import classNames from"classnames";import omit from"omit.js";import getScroll from"../_util/getScroll";import getRequestAnimationFrame from"../_util/getRequestAnimationFrame";var reqAnimFrame=getRequestAnimationFrame(),easeInOutCubic=function(e,t,r,o){var n=r-t;return(e/=o/2)<1?n/2*e*e*e+t:n/2*((e-=2)*e*e+2)+t};function noop(){}function getDefaultTarget(){return window}var BackTop=function(e){function t(e){_classCallCheck(this,t);var r=_possibleConstructorReturn(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return r.getCurrentScrollTop=function(){var e=(r.props.target||getDefaultTarget)();return e===window?window.pageYOffset||document.body.scrollTop||document.documentElement.scrollTop:e.scrollTop},r.scrollToTop=function(e){var t=r.getCurrentScrollTop(),o=Date.now();reqAnimFrame(function e(){var n=Date.now()-o;r.setScrollTop(easeInOutCubic(n,t,0,450)),n<450&&reqAnimFrame(e)}),(r.props.onClick||noop)(e)},r.handleScroll=function(){var e=r.props,t=e.visibilityHeight,o=e.target,n=getScroll((void 0===o?getDefaultTarget:o)(),!0);r.setState({visible:n>t})},r.state={visible:!1},r}return _inherits(t,e),_createClass(t,[{key:"setScrollTop",value:function(e){var t=(this.props.target||getDefaultTarget)();t===window?(document.body.scrollTop=e,document.documentElement.scrollTop=e):t.scrollTop=e}},{key:"componentDidMount",value:function(){var e=this.props.target||getDefaultTarget;this.scrollEvent=addEventListener(e(),"scroll",this.handleScroll),this.handleScroll()}},{key:"componentWillUnmount",value:function(){this.scrollEvent&&this.scrollEvent.remove()}},{key:"render",value:function(){var e=this.props,t=e.prefixCls,r=void 0===t?"dt-back-top":t,o=e.className,n=void 0===o?"":o,i=e.children,l=classNames(r,n),a=React.createElement("div",{className:r+"-content"},React.createElement("div",{className:r+"-icon"})),s=omit(this.props,["prefixCls","className","children","visibilityHeight","target"]),c=this.state.visible?React.createElement("div",_extends({},s,{className:l,onClick:this.scrollToTop}),i||a):null;return React.createElement(Animate,{component:"",transitionName:"fade"},c)}}]),t}(React.Component);export default BackTop;BackTop.defaultProps={visibilityHeight:400};