mobile-more
Version:
基于 antd-mobile v5 扩展移动端 UI 组件
32 lines • 1.11 kB
JavaScript
import React from 'react';
import { stopPropagation } from "../../utils/dom";
var MediaViewer = function MediaViewer(_ref) {
var url = _ref.url,
mediaType = _ref.mediaType;
var divRef = React.useRef(null);
var mediaRef = React.useRef(undefined);
React.useEffect(function () {
var divElement = divRef.current;
var mediaElement = mediaRef.current;
if (divElement && mediaElement) {
divElement.addEventListener('pointerdown', stopPropagation);
divElement.addEventListener('touchstart', stopPropagation);
return function () {
divElement.removeEventListener('pointerdown', stopPropagation);
divElement.removeEventListener('touchstart', stopPropagation);
if (mediaElement.played) {
mediaElement.pause();
}
};
}
}, []);
var props = {
src: url,
controls: true,
ref: mediaRef
};
return /*#__PURE__*/React.createElement("div", {
ref: divRef
}, mediaType == 'video' ? /*#__PURE__*/React.createElement("video", props) : /*#__PURE__*/React.createElement("audio", props));
};
export default MediaViewer;