@aliretail/react-materials-components/es/FormComponents/cascaderSelect/index.js

B 端物料组件库

import _CascaderSelect from "@alifd/next/es/cascader-select";
import _extends from "@babel/runtime/helpers/extends";
import * as React from 'react';
import { connect } from '@formily/next';
import { mapStyledProps, mapCustomComponent } from "../shared"; // 深度遍历查找目标节点及缓存相关路径

function findTreePath(value, tree) {
  if (tree.length === 0) return;

  for (var i = 0; i < tree.length; i++) {
    var item = tree[i];

    if (item.value === value) {
      // 如果找到， 则跳出
      return [item.label];
    }

    if (item.children) {
      var path = findTreePath(value, item.children);

      if (path.length > 0) {
        // 子节点找到, 把本节点插入到第一个
        path.splice(0, 0, item.label);
        return path;
      }
    }
  }

  return [];
}

var FormilyCascaderSelect = function FormilyCascaderSelect(props) {
  if (props.readOnly) {
    if (props.multiple && Array.isArray(props.value)) {
      // 多选情况下，value 为数组
      var displayArray = [];
      props.value.forEach(function (leafValue) {
        var findValue = findTreePath(leafValue, props.dataSource || []);
        displayArray.push( /*#__PURE__*/React.createElement("span", {
          key: leafValue,
          className: "aliretail-formily-cascader-readonly"
        }, (findValue === null || findValue === void 0 ? void 0 : findValue.join('/')) || '-'));
      });
      return /*#__PURE__*/React.createElement("div", {
        className: "aliretail-formily-cascader-readonly-array"
      }, displayArray);
    } else {
      // 单选情况下，value 为字符串
      var value = props.value;

      if (!value.length) {
        return '-';
      }

      if (Array.isArray(value)) value = value[0];
      var res = findTreePath(value, props.dataSource || []);
      return /*#__PURE__*/React.createElement("span", {
        className: "aliretail-formily-cascader-readonly"
      }, (res === null || res === void 0 ? void 0 : res.join('/')) || '-');
    }
  }

  var onChange = function onChange() {
    props.onChange && props.onChange.apply(props, arguments);
    props.onChangeBak && props.onChangeBak.apply(props, arguments);
  };

  return /*#__PURE__*/React.createElement(_CascaderSelect, _extends({}, props, {
    onChange: onChange
  }));
};

export var CascaderSelect = connect({
  getProps: mapStyledProps,
  getComponent: mapCustomComponent,
  defaultProps: {
    hasClear: true
  }
})(FormilyCascaderSelect);