transition.js 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. "use strict";
  2. const common_vendor = require("../../../../common/vendor.js");
  3. const 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. const transition = {
  11. methods: {
  12. // 组件被点击发出事件
  13. clickHandler() {
  14. this.$emit("click");
  15. },
  16. // vue版本的组件进场处理
  17. async vueEnter() {
  18. const classNames = getClassNames(this.mode);
  19. this.status = "enter";
  20. this.$emit("beforeEnter");
  21. this.inited = true;
  22. this.display = true;
  23. this.classes = classNames.enter;
  24. await common_vendor.nextTick$1();
  25. {
  26. await uni_modules_uviewPlus_libs_function_index.sleep(20);
  27. this.$emit("enter");
  28. this.transitionEnded = false;
  29. this.$emit("afterEnter");
  30. this.classes = classNames["enter-to"];
  31. }
  32. },
  33. // 动画离场处理
  34. async vueLeave() {
  35. if (!this.display)
  36. return;
  37. const classNames = getClassNames(this.mode);
  38. this.status = "leave";
  39. this.$emit("beforeLeave");
  40. this.classes = classNames.leave;
  41. await common_vendor.nextTick$1();
  42. {
  43. this.transitionEnded = false;
  44. this.$emit("leave");
  45. setTimeout(this.onTransitionEnd, this.duration);
  46. this.classes = classNames["leave-to"];
  47. }
  48. },
  49. // 完成过渡后触发
  50. onTransitionEnd() {
  51. if (this.transitionEnded)
  52. return;
  53. this.transitionEnded = true;
  54. this.$emit(this.status === "leave" ? "afterLeave" : "afterEnter");
  55. if (!this.show && this.display) {
  56. this.display = false;
  57. this.inited = false;
  58. }
  59. }
  60. }
  61. };
  62. exports.transition = transition;