From f4991944d13b94355fb8aaf03dad7d60ca530ee9 Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Thu, 30 Nov 2023 16:36:45 +0800 Subject: [PATCH] fix:是否修改 --- uni_modules/uview-ui/components/u-overlay/u-overlay.vue | 68 ++++++++++++++++++++++++++++++++++ 1 files changed, 68 insertions(+), 0 deletions(-) diff --git a/uni_modules/uview-ui/components/u-overlay/u-overlay.vue b/uni_modules/uview-ui/components/u-overlay/u-overlay.vue new file mode 100644 index 0000000..92de4e9 --- /dev/null +++ b/uni_modules/uview-ui/components/u-overlay/u-overlay.vue @@ -0,0 +1,68 @@ +<template> + <u-transition + :show="show" + custom-class="u-overlay" + :duration="duration" + :custom-style="overlayStyle" + @click="clickHandler" + > + <slot /> + </u-transition> +</template> + +<script> + import props from './props.js'; + + /** + * overlay ������ + * @description ������������������������������������������������������������������������������������������������������������������������������������������ + * @tutorial https://www.uviewui.com/components/overlay.html + * @property {Boolean} show ��������������������������� false ��� + * @property {String | Number} zIndex zIndex ��������������� 10070 ��� + * @property {String | Number} duration ������������������������������������ 300 ��� + * @property {String | Number} opacity ������������������������rgba������������������ ��������� 0.5 ��� + * @property {Object} customStyle ��������������������������������� + * @event {Function} click ������������������������ + * @example <u-overlay :show="show" @click="show = false"></u-overlay> + */ + export default { + name: "u-overlay", + mixins: [uni.$u.mpMixin, uni.$u.mixin,props], + computed: { + overlayStyle() { + const style = { + position: 'fixed', + top: 0, + left: 0, + right: 0, + zIndex: this.zIndex, + bottom: 0, + 'background-color': `rgba(0, 0, 0, ${this.opacity})` + } + return uni.$u.deepMerge(style, uni.$u.addStyle(this.customStyle)) + } + }, + methods: { + clickHandler() { + this.$emit('click') + } + } + } +</script> + +<style lang="scss" scoped> + @import "../../libs/css/components.scss"; + $u-overlay-top:0 !default; + $u-overlay-left:0 !default; + $u-overlay-width:100% !default; + $u-overlay-height:100% !default; + $u-overlay-background-color:rgba(0, 0, 0, .7) !default; + .u-overlay { + position: fixed; + top:$u-overlay-top; + left:$u-overlay-left; + width: $u-overlay-width; + height:$u-overlay-height; + background-color:$u-overlay-background-color; + } +</style> -- Gitblit v1.8.0