fastlion-amis
Version:
一种MIS页面生成工具
91 lines (90 loc) • 3.9 kB
JavaScript
/**
* @file 滚动加载组件
*/
Object.defineProperty(exports, "__esModule", { value: true });
exports.InfinteSroll = void 0;
var tslib_1 = require("tslib");
var react_1 = (0, tslib_1.__importDefault)(require("react"));
var theme_1 = require("../../../../theme");
var locale_1 = require("../../../../locale");
var antd_1 = require("antd");
require("./index.scss");
var InfiniteScrollContent = function (props) {
var hasMore = props.hasMore, __ = props.translate, loadMore = props.loadMore;
return (react_1.default.createElement(react_1.default.Fragment, null, hasMore ?
react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement(antd_1.Button, { onClick: loadMore, type: 'primary', size: 'small', style: { fontSize: 12 } }, "\u52A0\u8F7D\u66F4\u591A"))
: (react_1.default.createElement("span", null, __('NoMore')))));
};
function isElement(node) {
var ELEMENT_NODE_TYPE = 1;
return node.nodeType === ELEMENT_NODE_TYPE;
}
var getScrollParent = function (el, root) {
if (root === void 0) { root = window; }
var node = el;
var overflowScrollReg = /scroll|auto|overlay/i;
while (node && node !== root && isElement(node)) {
var overflowY = window.getComputedStyle(node).overflowY;
if (overflowScrollReg.test(overflowY)) {
return node;
}
node = node.parentNode;
}
return root;
};
var InfinteSroll = /** @class */ (function (_super) {
(0, tslib_1.__extends)(InfinteSroll, _super);
function InfinteSroll(props) {
var _this = _super.call(this, props) || this;
_this.handleCheck = function () {
var _a = _this.props, loadMore = _a.loadMore, hasMore = _a.hasMore;
if (!loadMore)
return;
clearTimeout(_this.checkTimer);
_this.checkTimer = setTimeout(function () {
if (!hasMore)
return;
var element = _this.elRef.current;
if (!_this.parent)
return;
var rect = element.getBoundingClientRect();
var elementTop = rect.top;
var current = _this.parent === window
? window.innerHeight
: _this.parent.getBoundingClientRect().bottom;
if (current >= elementTop - 250) {
loadMore();
}
}, 100);
};
_this.elRef = react_1.default.createRef();
return _this;
}
InfinteSroll.prototype.componentDidMount = function () {
var _a;
var element = this.elRef.current;
if (!element)
return;
this.parent = getScrollParent(element);
(_a = this.parent) === null || _a === void 0 ? void 0 : _a.addEventListener('scroll', this.handleCheck);
};
InfinteSroll.prototype.componentWillUnmount = function () {
var _a;
(_a = this.parent) === null || _a === void 0 ? void 0 : _a.removeEventListener('scroll', this.handleCheck);
};
InfinteSroll.prototype.render = function () {
var _a = this.props, hasMore = _a.hasMore, translate = _a.translate, loadMore = _a.loadMore;
return (react_1.default.createElement("div", { ref: this.elRef, className: 'infinteSroll' },
react_1.default.createElement(InfiniteScrollContent, { hasMore: hasMore, translate: translate, loadMore: loadMore })));
};
InfinteSroll.defaultProps = {
hasMore: true,
threshold: 250
};
return InfinteSroll;
}(react_1.default.Component));
exports.InfinteSroll = InfinteSroll;
exports.default = (0, theme_1.themeable)((0, locale_1.localeable)(InfinteSroll));
//# sourceMappingURL=./renderers/Lion/components/InfinteSroll/index.js.map
;