更新记录

1.0.2（2023-07-04）下载此版本

优化报错信息

1.0.1（2023-05-23）下载此版本

cus-popup

遮罩弹框

支持上中下左右类型

属性说明

属性名	类型	默认值	说明
value	Boolean	true	是否显示弹窗
position	String	center	弹窗方式 center 居中 √ left 左 √ right 右 √ top 上 bottom 下
duration	Number	100	隐藏间隔时间
headerIsCustom	Boolean	false	自定义头部高度是否包含
allowMarkClose	Boolean	true	是否允许点击mark区域关闭
zIndex	Number	10000	弹窗层级

使用示例

复制代码<cus-popup position="center" :zIndex="100" v-model="visible" :allowMarkClose="allowMarkClose"  popup-wrap-custom="custom-pop">
    <view class="">
        这是居中的弹窗
    </view>
</cus-popup>

复制代码import cusPopup from "@/components/cus-popup/popup.vue"
export default {
  components: {
    cusPopup
  },
  data() {
    return {
      allowMarkClose:true,
      visible:true
    }
  }
}

效果图

暂无

1.0.0（2023-05-12）下载此版本

cus-popup

遮罩弹框

支持上中下左右类型

属性说明

属性名	类型	默认值	说明
value	Boolean	true	是否显示弹窗
position	String	center	弹窗方式 center 居中 √ left 左 √ right 右 √ top 上 bottom 下
duration	Number	100	隐藏间隔时间
headerIsCustom	Boolean	false	自定义头部高度是否包含
allowMarkClose	Boolean	true	是否允许点击mark区域关闭
zIndex	Number	10000	弹窗层级

使用示例

复制代码<cus-popup position="left"  :zIndex="100" :value="visible" :allowMarkClose="allowMarkClose"  @change="popChange" popup-wrap-custom="custom-pop">
    <view class="">
        这是向左的弹窗
    </view>
</cus-popup>

复制代码import cusPopup from "@/components/cus-popup/popup.vue"
export default {
  components: {
    cusPopup
  },
  data() {
    return {
      allowMarkClose:true,
      visible:true
    }
  },
  methods: {
    popChange(val) {
      this.visible = val
    },
  },
}

效果图

暂无

平台兼容性

uni-app

Vue2	Vue3	Chrome	Safari	app-vue	app-nvue	Android	iOS	鸿蒙
√	√	√	√	√	√	-	-	-

微信小程序	支付宝小程序	抖音小程序	百度小程序	快手小程序	京东小程序	鸿蒙元服务	QQ小程序	飞书小程序	快应用-华为	快应用-联盟
√	√	√	√	√	√	-	√	√	√	√

其他

多语言	暗黑模式	宽屏模式
×	×	√

cus-popup

遮罩弹框

支持上中下左右类型

属性说明

属性名	类型	默认值	说明
value	Boolean	true	是否显示弹窗
position	String	center	弹窗方式 center 居中 √ left 左 √ right 右 √ top 上 bottom 下
duration	Number	100	隐藏间隔时间
headerIsCustom	Boolean	false	自定义头部高度是否包含
allowMarkClose	Boolean	true	是否允许点击mark区域关闭
zIndex	Number	10000	弹窗层级

使用示例

复制代码<cus-popup position="center" :zIndex="100" v-model="visible" :allowMarkClose="allowMarkClose"  popup-wrap-custom="custom-pop">
    <view class="">
        这是居中的弹窗
    </view>
</cus-popup>

复制代码import cusPopup from "@/components/cus-popup/popup.vue"
export default {
  components: {
    cusPopup
  },
  data() {
    return {
      allowMarkClose:true,
      visible:true
    }
  }
}

效果图

暂无

watch:{ 'value': { immediate: true, deep:true, handler(val) { console.log(this.isFirst,val,this.flag,'this.flag---') if(this.isFirst && val === this.flag) { return } if(val) { this.showModal(val) } else { this.hideModal(val)

cus-popup 弹出层 js

更新记录

1.0.2（2023-07-04）下载此版本

1.0.1（2023-05-23）下载此版本

cus-popup

属性说明

使用示例

效果图

1.0.0（2023-05-12）下载此版本

cus-popup

属性说明

使用示例

效果图

平台兼容性

uni-app

其他

cus-popup

属性说明

使用示例

效果图

隐私、权限声明

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

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

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

许可协议

MIT协议

下拉选择，单选，精准搜索，模糊搜索，清除选择

图片拖动缩放旋转插件

自定义音频组件

横屏滚动抽奖

轮播-走马灯

cus-popup 弹出层 js

更新记录

1.0.2（2023-07-04） 下载此版本

1.0.1（2023-05-23） 下载此版本

cus-popup

属性说明

使用示例

效果图

1.0.0（2023-05-12） 下载此版本

cus-popup

属性说明

使用示例

效果图

平台兼容性

uni-app

其他

cus-popup

属性说明

使用示例

效果图

隐私、权限声明

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

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

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

许可协议

MIT协议

下拉选择，单选，精准搜索，模糊搜索，清除选择

图片拖动 缩放 旋转插件

自定义音频组件

横屏滚动抽奖

轮播-走马灯

Modal title

1.0.2（2023-07-04）下载此版本

1.0.1（2023-05-23）下载此版本

1.0.0（2023-05-12）下载此版本

图片拖动缩放旋转插件