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