平台兼容性

popUp 自由灵活的弹层

可进行多种属性操控的弹层组件,组件名:jcPopUp,代码块:

Bug修复:

1、在属性markTapHide='true'时,本意是点击蒙层可关闭弹层。bug:点击弹层自身也会关闭。已修复!

使用方式:

template 中使用组件

<jc-popUp position="bottom" ref="pop4" closeIcon="true" iconSize="40" iconTop="20" iconLeft="45">
    <view style="width:100%;height:70%;background:#FFFFFF;position:absolute;bottom:0;right:0;">
                `````````````````````````````````````````·····································
                    弹层宽、高、背景色                           弹层在屏幕中的位置
    </view>         
</jc-popUp>

script 中引用组件

import jcPopUp from '@/components/jc-popUp/jc-popUp.vue';
export default {
    data() {
        return {

        }
    },
    methods: {
        popFour(){
            this.$refs.pop4.show(); ···在事件中使ref="pop4"的弹层出现
            this.$refs.pop4.hide(); ···在事件中使ref="pop4"的弹层消失
        }
    },
    components: {jcPopUp}
}

jcPopUp 属性说明:

属性名 类型 默认值 说明
position String '' 弹层出现的方位,必填,top/bottom/left/right可选
ref String '' 弹层识别器,必填,一个页面可能会使用多个弹层
closeIcon String '' 白色的关闭图标是否显示,选填,默认不显示,'true'可显示
iconSize String '26' 关闭图标的大小,单位px
iconTop String '0' 图标距离屏幕顶部的距离,单位%
iconLeft String '0' 图标距离屏幕左边的距离,单位%
markTapHide String '' 点击蒙层关闭弹层,默认不关闭,'true'可关闭
markMove String 'false' 击穿蒙层进行滑动页面,默认不击穿,'true'可击穿

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问