更新记录
1.0.1(2024-01-19)
下载此版本
默认图片改为非长图模式,图片默认高度改为自动
1.0.0(2023-12-04)
下载此版本
更新图片预览插件
平台兼容性
App |
快应用 |
微信小程序 |
支付宝小程序 |
百度小程序 |
字节小程序 |
QQ小程序 |
HBuilderX 3.1.0 |
× |
√ |
× |
× |
× |
× |
钉钉小程序 |
快手小程序 |
飞书小程序 |
京东小程序 |
× |
× |
× |
× |
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
× |
× |
× |
× |
× |
× |
× |
× |
× |
gyc-previewimages
这是一个预览图片的组件,功能类似于uni.previewImage;
使用该组件可避免调用uni.previewImage api时所产生触发onshow,onhide的问题;
近期发现uni.previewImage在微信小程序中,部分安卓机型存在图片显示黑屏的问题,使用此组件可避免该问题;
可参考下面使用例子:
<template>
<view>
<image class="cover" v-for="(item,idx) in imgsList" :key="idx" :src="item" @click="handlerImgs(idx)"></image>
<!-- 引入组件 -->
<gyc-previewimages ref="imgs"></gyc-previewimages>
</view>
</template>
<script>
export default {
data() {
return {
// 图片列表,自行填入地址
imgsList: [
"https://iph.href.lu/500x500",
"https://iph.href.lu/500x1800?fg=666666&bg=cccccc"
]
}
},
methods: {
/**
* 预览图片
* @param {Object} idx 图片索引
*/
handlerImgs(idx) {
// 调用组件内previewImages方法
// 该方法传入current参数(当前展示的图片的索引),urls参数(当前展示的图片列表,格式参考imgsList)
this.$refs.imgs.previewImages({
current: idx,
urls: this.imgsList
})
}
}
}
</script>
<style scoped lang="scss">
.cover {
width: 300rpx;
height: 300rpx;
}
</style>