mobile-more
Version:
基于 antd-mobile v5 扩展移动端 UI 组件
81 lines (80 loc) • 3.89 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _react = _interopRequireWildcard(require("react"));
var _countdownPro = _interopRequireDefault(require("countdown-pro"));
var _rcHooks = require("rc-hooks");
var _antdMobile = require("antd-mobile");
var _BizConfigProvider = require("../BizConfigProvider");
var _excluded = ["start", "initText", "runText", "resetText", "second", "onEnd"];
var BizCaptchaButton = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
var _useConfig = (0, _BizConfigProvider.useConfig)(),
locale = _useConfig.locale;
var _props$start = props.start,
start = _props$start === void 0 ? false : _props$start,
_props$initText = props.initText,
initText = _props$initText === void 0 ? locale.captcha.initText : _props$initText,
_props$runText = props.runText,
runText = _props$runText === void 0 ? locale.captcha.runText : _props$runText,
_props$resetText = props.resetText,
resetText = _props$resetText === void 0 ? locale.captcha.resetText : _props$resetText,
_props$second = props.second,
second = _props$second === void 0 ? 60 : _props$second,
onEnd = props.onEnd,
restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
var _useState = (0, _react.useState)(second),
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
time = _useState2[0],
setTime = _useState2[1];
var completedRef = (0, _react.useRef)(false);
var latestOnEnd = (0, _rcHooks.useLatest)(onEnd);
var countdownRef = (0, _react.useRef)(undefined);
if (!countdownRef.current) {
countdownRef.current = new _countdownPro.default({
time: second * 1000,
adjustInterval: 10 * 1000,
onChange: function onChange(currentTime) {
setTime(currentTime / 1000);
},
onEnd: function onEnd() {
var _latestOnEnd$current;
completedRef.current = true;
(_latestOnEnd$current = latestOnEnd.current) === null || _latestOnEnd$current === void 0 || _latestOnEnd$current.call(latestOnEnd);
}
});
}
(0, _react.useEffect)(function () {
if (start) {
var _countdownRef$current;
(_countdownRef$current = countdownRef.current) === null || _countdownRef$current === void 0 || _countdownRef$current.restart();
} else {
var _countdownRef$current2;
(_countdownRef$current2 = countdownRef.current) === null || _countdownRef$current2 === void 0 || _countdownRef$current2.pause();
}
return function () {
var _countdownRef$current3;
(_countdownRef$current3 = countdownRef.current) === null || _countdownRef$current3 === void 0 || _countdownRef$current3.pause();
};
}, [start]);
(0, _rcHooks.useUpdateEffect)(function () {
var _countdownRef$current4;
(_countdownRef$current4 = countdownRef.current) === null || _countdownRef$current4 === void 0 || _countdownRef$current4.updateOptions({
time: second * 1000
});
}, [second]);
return /*#__PURE__*/_react.default.createElement(_antdMobile.Button, (0, _extends2.default)({
loadingText: locale.captcha.loadingText
}, restProps, {
ref: ref,
disabled: start
}), !start && (completedRef.current ? resetText : initText), start && runText.replace(/%s/g, time.toString()));
});
BizCaptchaButton.displayName = 'BizCaptchaButton';
var _default = exports.default = BizCaptchaButton;