transition.js 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. "use strict";
  2. var common_vendor = require("../../../../common/vendor.js");
  3. var uni_modules_uviewPlus_libs_function_index = require("../../libs/function/index.js");
  4. const getClassNames = (name) => ({
  5. enter: `u-${name}-enter u-${name}-enter-active`,
  6. "enter-to": `u-${name}-enter-to u-${name}-enter-active`,
  7. leave: `u-${name}-leave u-${name}-leave-active`,
  8. "leave-to": `u-${name}-leave-to u-${name}-leave-active`
  9. });
  10. var transition = {
  11. methods: {
  12. clickHandler() {
  13. this.$emit("click");
  14. },
  15. async vueEnter() {
  16. const classNames = getClassNames(this.mode);
  17. this.status = "enter";
  18. this.$emit("beforeEnter");
  19. this.inited = true;
  20. this.display = true;
  21. this.classes = classNames.enter;
  22. await common_vendor.nextTick();
  23. {
  24. await uni_modules_uviewPlus_libs_function_index.sleep(20);
  25. this.$emit("enter");
  26. this.transitionEnded = false;
  27. this.$emit("afterEnter");
  28. this.classes = classNames["enter-to"];
  29. }
  30. },
  31. async vueLeave() {
  32. if (!this.display)
  33. return;
  34. const classNames = getClassNames(this.mode);
  35. this.status = "leave";
  36. this.$emit("beforeLeave");
  37. this.classes = classNames.leave;
  38. await common_vendor.nextTick();
  39. {
  40. this.transitionEnded = false;
  41. this.$emit("leave");
  42. setTimeout(this.onTransitionEnd, this.duration);
  43. this.classes = classNames["leave-to"];
  44. }
  45. },
  46. onTransitionEnd() {
  47. if (this.transitionEnded)
  48. return;
  49. this.transitionEnded = true;
  50. this.$emit(this.status === "leave" ? "afterLeave" : "afterEnter");
  51. if (!this.show && this.display) {
  52. this.display = false;
  53. this.inited = false;
  54. }
  55. }
  56. }
  57. };
  58. exports.transition = transition;