1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798 |
- "use strict";
- const common_vendor = require("../../../../common/vendor.js");
- const _sfc_main = {
- name: "u-loading-icon",
- mixins: [common_vendor.mpMixin, common_vendor.mixin, common_vendor.props$4],
- data() {
- return {
- // Array.form可以通过一个伪数组对象创建指定长度的数组
- // https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/from
- array12: Array.from({
- length: 12
- }),
- // 这里需要设置默认值为360,否则在安卓nvue上,会延迟一个duration周期后才执行
- // 在iOS nvue上,则会一开始默认执行两个周期的动画
- aniAngel: 360,
- // 动画旋转角度
- webviewHide: false,
- // 监听webview的状态,如果隐藏了页面,则停止动画,以免性能消耗
- loading: false
- // 是否运行中,针对nvue使用
- };
- },
- computed: {
- // 当为circle类型时,给其另外三边设置一个更轻一些的颜色
- // 之所以需要这么做的原因是,比如父组件传了color为红色,那么需要另外的三个边为浅红色
- // 而不能是固定的某一个其他颜色(因为这个固定的颜色可能浅蓝,导致效果没有那么细腻良好)
- otherBorderColor() {
- const lightColor = common_vendor.index.$u.colorGradient(this.color, "#ffffff", 100)[80];
- if (this.mode === "circle") {
- return this.inactiveColor ? this.inactiveColor : lightColor;
- } else {
- return "transparent";
- }
- }
- },
- watch: {
- show(n) {
- }
- },
- mounted() {
- this.init();
- },
- methods: {
- init() {
- setTimeout(() => {
- }, 20);
- },
- // 监听webview的显示与隐藏
- addEventListenerToWebview() {
- const pages = getCurrentPages();
- const page = pages[pages.length - 1];
- const currentWebview = page.$getAppWebview();
- currentWebview.addEventListener("hide", () => {
- this.webviewHide = true;
- });
- currentWebview.addEventListener("show", () => {
- this.webviewHide = false;
- });
- }
- }
- };
- function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
- return common_vendor.e({
- a: _ctx.show
- }, _ctx.show ? common_vendor.e({
- b: !$data.webviewHide
- }, !$data.webviewHide ? common_vendor.e({
- c: _ctx.mode === "spinner"
- }, _ctx.mode === "spinner" ? {
- d: common_vendor.f($data.array12, (item, index, i0) => {
- return {
- a: index
- };
- })
- } : {}, {
- e: common_vendor.n(`u-loading-icon__spinner--${_ctx.mode}`),
- f: _ctx.color,
- g: _ctx.$u.addUnit(_ctx.size),
- h: _ctx.$u.addUnit(_ctx.size),
- i: _ctx.color,
- j: $options.otherBorderColor,
- k: $options.otherBorderColor,
- l: $options.otherBorderColor,
- m: `${_ctx.duration}ms`,
- n: _ctx.mode === "semicircle" || _ctx.mode === "circle" ? _ctx.timingFunction : ""
- }) : {}, {
- o: _ctx.text
- }, _ctx.text ? {
- p: common_vendor.t(_ctx.text),
- q: _ctx.$u.addUnit(_ctx.textSize),
- r: _ctx.textColor
- } : {}, {
- s: common_vendor.s(_ctx.$u.addStyle(_ctx.customStyle)),
- t: common_vendor.n(_ctx.vertical && "u-loading-icon--vertical")
- }) : {});
- }
- const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["render", _sfc_render], ["__scopeId", "data-v-00752c6d"], ["__file", "D:/project/赋强公证/notarization_applet/node_modules/uview-plus/components/u-loading-icon/u-loading-icon.vue"]]);
- wx.createComponent(Component);
|