ErrorList.js 2.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
  2. import { createVNode as _createVNode } from "vue";
  3. import { useInjectFormItemPrefix } from './context';
  4. import { computed, defineComponent, ref, watch } from 'vue';
  5. import { getTransitionGroupProps, TransitionGroup } from '../_util/transition';
  6. import useConfigInject from '../_util/hooks/useConfigInject';
  7. import collapseMotion from '../_util/collapseMotion';
  8. export default defineComponent({
  9. compatConfig: {
  10. MODE: 3
  11. },
  12. name: 'ErrorList',
  13. props: ['errors', 'help', 'onDomErrorVisibleChange', 'helpStatus', 'warnings'],
  14. setup: function setup(props) {
  15. var _useConfigInject = useConfigInject('', props),
  16. rootPrefixCls = _useConfigInject.prefixCls;
  17. var _useInjectFormItemPre = useInjectFormItemPrefix(),
  18. prefixCls = _useInjectFormItemPre.prefixCls,
  19. status = _useInjectFormItemPre.status;
  20. var baseClassName = computed(function () {
  21. return "".concat(prefixCls.value, "-item-explain");
  22. });
  23. var visible = computed(function () {
  24. return !!(props.errors && props.errors.length);
  25. });
  26. var innerStatus = ref(status.value);
  27. // Memo status in same visible
  28. watch([visible, status], function () {
  29. if (visible.value) {
  30. innerStatus.value = status.value;
  31. }
  32. });
  33. return function () {
  34. var _props$errors, _props$errors2;
  35. var colMItem = collapseMotion("".concat(rootPrefixCls.value, "-show-help-item"));
  36. var transitionGroupProps = getTransitionGroupProps("".concat(rootPrefixCls.value, "-show-help-item"), colMItem);
  37. transitionGroupProps.class = baseClassName.value;
  38. return (_props$errors = props.errors) !== null && _props$errors !== void 0 && _props$errors.length ? _createVNode(TransitionGroup, _objectSpread(_objectSpread({}, transitionGroupProps), {}, {
  39. "tag": "div"
  40. }), {
  41. default: function _default() {
  42. return [(_props$errors2 = props.errors) === null || _props$errors2 === void 0 ? void 0 : _props$errors2.map(function (error, index) {
  43. return _createVNode("div", {
  44. "key": index,
  45. "role": "alert",
  46. "class": innerStatus.value ? "".concat(baseClassName.value, "-").concat(innerStatus.value) : ''
  47. }, [error]);
  48. })];
  49. }
  50. }) : null;
  51. };
  52. }
  53. });