@orca-fe/hooks
Version:
React Hooks Collections
242 lines (237 loc) • 9.07 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
exports.defaultFormatter = defaultFormatter;
exports.isPageResult = exports.isFetchResult = void 0;
exports.useLoadMore = useLoadMore;
var _regeneratorRuntime2 = _interopRequireDefault(require("@babel/runtime/helpers/regeneratorRuntime"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
var _ahooks = require("ahooks");
var _react = require("react");
/* eslint-disable @typescript-eslint/no-explicit-any */
var eArr = [];
var loadMoreFlag = {};
var isFetchResult = exports.isFetchResult = function isFetchResult(value) {
if (value != null && (0, _typeof2.default)(value) === 'object') {
if ('data' in value) {
return true;
}
}
return false;
};
var isPageResult = exports.isPageResult = function isPageResult(value) {
if (value != null && (0, _typeof2.default)(value) === 'object') {
if ('total' in value && 'list' in value && Array.isArray(value.list) && typeof value.total === 'number') {
return true;
}
}
return false;
};
function defaultFormatter(res) {
var t = res;
if (isFetchResult(t)) {
t = t.data;
}
if (isPageResult(t)) {
return t;
}
throw new Error('[useLoadMore] Service result is not a page result. Please use formatter to convert the result to `PageResultType`.');
}
function useLoadMore(_service) {
var _stateMgr$state, _stateMgr$setState, _data$list2;
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
var _options$defaultParam = options.defaultParams,
defaultParams = _options$defaultParam === void 0 ? [] : _options$defaultParam,
_options$manual = options.manual,
manual = _options$manual === void 0 ? false : _options$manual,
_options$pageSize = options.pageSize,
pageSize = _options$pageSize === void 0 ? 10 : _options$pageSize,
onError = options.onError,
onSuccess = options.onSuccess,
_options$formatter = options.formatter,
formatter = _options$formatter === void 0 ? defaultFormatter : _options$formatter,
stateMgr = options.stateMgr,
onFinish = options.onFinish;
var service = (0, _ahooks.useMemoizedFn)(_service);
// 组件状态控制 start
var _useState = (0, _react.useState)(function () {
return {
loading: false,
data: {
list: [],
total: 0
},
page: 1,
params: defaultParams
};
}),
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
__state = _useState2[0],
__setState = _useState2[1];
var state = (_stateMgr$state = stateMgr === null || stateMgr === void 0 ? void 0 : stateMgr.state) !== null && _stateMgr$state !== void 0 ? _stateMgr$state : __state;
var _setState = (_stateMgr$setState = stateMgr === null || stateMgr === void 0 ? void 0 : stateMgr.setState) !== null && _stateMgr$setState !== void 0 ? _stateMgr$setState : __setState;
var _this = (0, _react.useRef)({
unloaded: false,
ticket: 0,
loading: false
}).current;
var setState = (0, _ahooks.useMemoizedFn)(function () {
var newState = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
if (!_this.unloaded) {
_setState(function (state) {
return (0, _objectSpread2.default)((0, _objectSpread2.default)({}, state), newState);
});
}
});
// 组件状态控制 end
var _state$loading = state.loading,
loading = _state$loading === void 0 ? false : _state$loading,
data = state.data,
error = state.error,
params = state.params,
_state$page = state.page,
page = _state$page === void 0 ? 1 : _state$page;
// 发起请求
var load = (0, _ahooks.useMemoizedFn)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee() {
var _len,
_args,
_key,
isLoadMore,
args,
pageIndex,
ticket,
_res,
formattedData,
_data$list,
_args2 = arguments;
return (0, _regeneratorRuntime2.default)().wrap(function _callee$(_context) {
while (1) switch (_context.prev = _context.next) {
case 0:
for (_len = _args2.length, _args = new Array(_len), _key = 0; _key < _len; _key++) {
_args[_key] = _args2[_key];
}
// 取第一个参数判断是否加载更多
isLoadMore = _args[0] === loadMoreFlag; // 取得参数(如果是加载更多,需要从 state 中取得参数)
args = isLoadMore ? params !== null && params !== void 0 ? params : defaultParams : _args;
pageIndex = isLoadMore ? page + 1 : 1;
ticket = performance.now();
_this.ticket = ticket;
_this.loading = true;
setState({
loading: true,
error: undefined
});
_context.prev = 8;
_context.next = 11;
return service.apply(void 0, [{
pageIndex: pageIndex,
pageSize: pageSize
}].concat((0, _toConsumableArray2.default)(args)));
case 11:
_res = _context.sent;
formattedData = formatter(_res);
if (!(formattedData == null)) {
_context.next = 15;
break;
}
throw new Error('[useLoadMore] Formatted result is undefined');
case 15:
if (_this.ticket === ticket) {
// 请求结果有效
_this.loading = false;
setState({
params: args,
loading: false,
data: isLoadMore ? {
list: [].concat((0, _toConsumableArray2.default)((_data$list = data === null || data === void 0 ? void 0 : data.list) !== null && _data$list !== void 0 ? _data$list : []), (0, _toConsumableArray2.default)(formattedData.list)),
total: formattedData.total
} : formattedData,
page: pageIndex
});
if (formattedData != null) {
if (typeof onSuccess === 'function') {
onSuccess(formattedData, args);
}
} else if (typeof onError === 'function') {
onError(new Error('result is undefined'), args);
}
if (typeof onFinish === 'function') {
onFinish(_res, args);
}
} else {
console.warn('Request response out date.');
}
return _context.abrupt("return", formattedData);
case 19:
_context.prev = 19;
_context.t0 = _context["catch"](8);
console.error(_context.t0);
_this.loading = false;
setState({
data: {
list: [],
total: 0
},
error: _context.t0,
loading: false
});
if (typeof onError === 'function') {
onError(_context.t0, args);
}
case 25:
return _context.abrupt("return", undefined);
case 26:
case "end":
return _context.stop();
}
}, _callee, null, [[8, 19]]);
})));
var run = (0, _ahooks.useMemoizedFn)(load);
var loadMore = (0, _ahooks.useMemoizedFn)( /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/(0, _regeneratorRuntime2.default)().mark(function _callee2() {
return (0, _regeneratorRuntime2.default)().wrap(function _callee2$(_context2) {
while (1) switch (_context2.prev = _context2.next) {
case 0:
return _context2.abrupt("return", load(loadMoreFlag));
case 1:
case "end":
return _context2.stop();
}
}, _callee2);
})));
var cancel = (0, _ahooks.useMemoizedFn)(function () {
_this.ticket = Date.now();
});
(0, _react.useEffect)(function () {
_this.loading = false;
_this.unloaded = false;
// 如果 manual === false,则需要主动加载一次
if (!manual) {
load.apply(void 0, (0, _toConsumableArray2.default)(defaultParams));
}
return function () {
_this.unloaded = true;
};
}, []);
var list = (_data$list2 = data === null || data === void 0 ? void 0 : data.list) !== null && _data$list2 !== void 0 ? _data$list2 : eArr;
var total = (data === null || data === void 0 ? void 0 : data.total) || 0;
return {
loading: loading,
params: params,
data: list,
total: total,
page: page,
hasMore: list.length < total,
error: error,
run: run,
loadMore: loadMore,
cancel: cancel
};
}
var _default = exports.default = useLoadMore;