linkmore-design/es/lm-upload/components/Preview.js

🌈 🚀lm组件库。🚀

import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
import React, { useMemo } from 'react';
import ImageViewer from "../../image-viewer";
var Preview = function Preview(_ref) {
  var instance = _ref.instance;
  var enabledPreview = instance.enabledPreview,
    state = instance.state,
    dispatch = instance.dispatch,
    getFileList = instance.getFileList;
  if (!enabledPreview) return null;

  // 与展示顺序保持一致
  var fileList = useMemo(function () {
    var _getFileList;
    return (_getFileList = getFileList()) === null || _getFileList === void 0 ? void 0 : _getFileList.sort(function (a, b) {
      return (a === null || a === void 0 ? void 0 : a.seq) - (b === null || b === void 0 ? void 0 : b.seq);
    });
  }, [getFileList]);
  var config = useMemo(function () {
    var _state$preview = state.preview,
      index = _state$preview.index,
      visible = _state$preview.visible;
    return {
      // urlList: fileList?.map(({ url }) => url),
      urlList: fileList === null || fileList === void 0 ? void 0 : fileList.map(function (item) {
        return _objectSpread(_objectSpread({}, item), {}, {
          subHtml: (instance === null || instance === void 0 ? void 0 : instance.subHtml) || ''
        });
      }),
      initialIndex: index,
      visible: visible,
      close: function close() {
        dispatch({
          type: 'changePreview',
          preview: {
            visible: false
          }
        });
      }
    };
  }, [fileList, state.preview]);
  return /*#__PURE__*/React.createElement(ImageViewer, config);
};
export default /*#__PURE__*/React.memo(Preview);