mobile-more
Version:
基于 antd-mobile v5 扩展移动端 UI 组件
39 lines (38 loc) • 1.42 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _dom = require("../../utils/dom");
var MediaViewer = function MediaViewer(_ref) {
var url = _ref.url,
mediaType = _ref.mediaType;
var divRef = _react.default.useRef(null);
var mediaRef = _react.default.useRef(undefined);
_react.default.useEffect(function () {
var divElement = divRef.current;
var mediaElement = mediaRef.current;
if (divElement && mediaElement) {
divElement.addEventListener('pointerdown', _dom.stopPropagation);
divElement.addEventListener('touchstart', _dom.stopPropagation);
return function () {
divElement.removeEventListener('pointerdown', _dom.stopPropagation);
divElement.removeEventListener('touchstart', _dom.stopPropagation);
if (mediaElement.played) {
mediaElement.pause();
}
};
}
}, []);
var props = {
src: url,
controls: true,
ref: mediaRef
};
return /*#__PURE__*/_react.default.createElement("div", {
ref: divRef
}, mediaType == 'video' ? /*#__PURE__*/_react.default.createElement("video", props) : /*#__PURE__*/_react.default.createElement("audio", props));
};
var _default = exports.default = MediaViewer;