collapseMotion.js 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. import { nextTick } from 'vue';
  2. import { addClass, removeClass } from '../vc-util/Dom/class';
  3. var collapseMotion = function collapseMotion() {
  4. var name = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'ant-motion-collapse';
  5. var appear = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
  6. return {
  7. name: name,
  8. appear: appear,
  9. css: true,
  10. onBeforeEnter: function onBeforeEnter(node) {
  11. node.style.height = '0px';
  12. node.style.opacity = '0';
  13. addClass(node, name);
  14. },
  15. onEnter: function onEnter(node) {
  16. nextTick(function () {
  17. node.style.height = "".concat(node.scrollHeight, "px");
  18. node.style.opacity = '1';
  19. });
  20. },
  21. onAfterEnter: function onAfterEnter(node) {
  22. if (node) {
  23. removeClass(node, name);
  24. node.style.height = null;
  25. node.style.opacity = null;
  26. }
  27. },
  28. onBeforeLeave: function onBeforeLeave(node) {
  29. addClass(node, name);
  30. node.style.height = "".concat(node.offsetHeight, "px");
  31. node.style.opacity = null;
  32. },
  33. onLeave: function onLeave(node) {
  34. setTimeout(function () {
  35. node.style.height = '0px';
  36. node.style.opacity = '0';
  37. });
  38. },
  39. onAfterLeave: function onAfterLeave(node) {
  40. if (node) {
  41. removeClass(node, name);
  42. if (node.style) {
  43. node.style.height = null;
  44. node.style.opacity = null;
  45. }
  46. }
  47. }
  48. };
  49. };
  50. export default collapseMotion;