@aliretail/react-materials-components/es/FormComponents/PreviewText.js

B 端物料组件库

import React, { useContext } from 'react';
import { isFn, isEqual } from '@formily/shared';
import { PreviewTextContext } from '@formily/react-shared-components/lib/context';
export var PreviewText = function PreviewText(props) {
  var context = useContext(PreviewTextContext) || {};
  var value; // 处理 dataSource

  if (props.dataSource && props.dataSource.length) {
    // value 是数组
    if (Array.isArray(props.value)) {
      value = props.value.map(function (val, index) {
        var findValue = props.dataSource.find(function (item) {
          return isEqual(item.value, val);
        });

        if (findValue) {
          return /*#__PURE__*/React.createElement("span", {
            key: index
          }, findValue.label, index < props.value.length - 1 ? ' ,' : '');
        }

        return null;
      });
    } else {
      var findValue = props.dataSource.find(function (item) {
        return isEqual(item.value, props.value);
      });

      if (findValue) {
        value = findValue.label;
      }
    } // 未传入任何 dataSource

  } else if (Array.isArray(props.value)) {
    value = props.value.map(function (val, index) {
      return /*#__PURE__*/React.createElement("span", {
        key: index
      }, val, index < props.value.length - 1 ? '~' : '');
    });
  } else {
    value = String(props.value === undefined || props.value === null ? '' : props.value);
  }

  var placeholder = isFn(context.previewPlaceholder) ? context.previewPlaceholder(props) : context.previewPlaceholder;
  return /*#__PURE__*/React.createElement("p", {
    style: {
      padding: 0,
      margin: 0
    },
    className: "aliretail-preview-text " + (props.className || '')
  }, props.addonBefore ? props.addonBefore : '', props.innerBefore ? props.innerBefore : '', props.addonTextBefore ? props.addonTextBefore : '', value === '' || value === undefined || Array.isArray(value) && value.length === 0 ? placeholder || '-' : value, props.addonTextAfter ? props.addonTextAfter : '', props.innerAfter ? props.innerAfter : '', props.addonAfter ? props.addonAfter : '');
};
PreviewText.ConfigProvider = PreviewTextContext.Provider;