更新记录
1.0.0(2025-05-15) 下载此版本
v1:支持从上到下滑动展示出弹框
平台兼容性
Vue2 | Vue3 |
---|---|
√ | √ |
App | 快应用 | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 |
---|---|---|---|---|---|---|
HBuilderX 4.0 app-vue | √ | √ | √ | √ | √ | √ |
钉钉小程序 | 快手小程序 | 飞书小程序 | 京东小程序 | 鸿蒙元服务 |
---|---|---|---|---|
√ | √ | √ | √ | × |
H5-Safari | Android Browser | 微信浏览器(Android) | QQ浏览器(Android) | Chrome | IE | Edge | Firefox | PC-Safari |
---|---|---|---|---|---|---|---|---|
√ | √ | √ | √ | √ | √ | √ | √ | √ |
d-pupop 滑动弹框【从上到下】
全部插件地址:https://ext.dcloud.net.cn/publisher?id=117346
2025【已亲测可用:已测试 vue2 vue3 h5和app,小程序 如有任何问题可直接联系我】
d-pupop 从顶部向下滑动展示的弹框,主要用于搜索:
属性:
属性 | 是否必填 | 值类型 | 默认值 | 说明 |
---|---|---|---|---|
top | false | Number | 0 | 弹框距离顶部距离px |
<d-pupop ref="dPupop" top="300">
<template v-slot:result>
</template>
</d-pupop>
示例:
<d-pupop ref="dPupop" top="300">
<template v-slot:result>
<view style="background: ##9bf;width: 100%;height: 100px;" @click="onChangeShow">
关闭弹框
</view>
</template>
</d-pupop>
==================================================
onChangeShow() {
this.$refs.dPupop.onChangeShow()
}
-------
// 获取class高度
getContentHeight() {
let windowHeight = getApp().globalData.systemInfo.windowHeight;
uni.createSelectorQuery().in(this).select('.container-search').boundingClientRect((rect) => {
this.top = rect.bottom + 'px'
}).exec()
},
【完】
以下代码不需要看,只是解释下如何从插件传递多个参数
<slot name="result" :results="dev" :www="hehe" ></slot>
<template v-slot:result="{ results,www }">
<view style="background: ##9bf;width: 100%;height: 100px;" @click="onClickShow">
{{results}}{{www}}
</view>
</template>