u-transition.js 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. "use strict";
  2. const common_vendor = require("../../../../common/vendor.js");
  3. const _sfc_main = {
  4. name: "u-transition",
  5. data() {
  6. return {
  7. inited: false,
  8. // 是否显示/隐藏组件
  9. viewStyle: {},
  10. // 组件内部的样式
  11. status: "",
  12. // 记录组件动画的状态
  13. transitionEnded: false,
  14. // 组件是否结束的标记
  15. display: false,
  16. // 组件是否展示
  17. classes: ""
  18. // 应用的类名
  19. };
  20. },
  21. computed: {
  22. mergeStyle() {
  23. const { viewStyle, customStyle } = this;
  24. return {
  25. transitionDuration: `${this.duration}ms`,
  26. // display: `${this.display ? '' : 'none'}`,
  27. transitionTimingFunction: this.timingFunction,
  28. // 避免自定义样式影响到动画属性,所以写在viewStyle前面
  29. ...common_vendor.index.$u.addStyle(customStyle),
  30. ...viewStyle
  31. };
  32. }
  33. },
  34. // 将mixin挂在到组件中,uni.$u.mixin实际上为一个vue格式对象
  35. mixins: [common_vendor.mpMixin, common_vendor.mixin, common_vendor.transition, common_vendor.props$30],
  36. watch: {
  37. show: {
  38. handler(newVal) {
  39. newVal ? this.vueEnter() : this.vueLeave();
  40. },
  41. // 表示同时监听初始化时的props的show的意思
  42. immediate: true
  43. }
  44. }
  45. };
  46. function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
  47. return common_vendor.e({
  48. a: $data.inited
  49. }, $data.inited ? {
  50. b: common_vendor.o((...args) => _ctx.clickHandler && _ctx.clickHandler(...args)),
  51. c: common_vendor.n($data.classes),
  52. d: common_vendor.s($options.mergeStyle),
  53. e: common_vendor.o((...args) => _ctx.noop && _ctx.noop(...args))
  54. } : {});
  55. }
  56. const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-0573594d"], ["__file", "F:/兴元/开门柜项目/平台端管理系统小程序/node_modules/uview-plus/components/u-transition/u-transition.vue"]]);
  57. wx.createComponent(Component);