banner
banner
banner
NEWS LETTER

微信小程序-动态展示图片,高度不一致

Scroll down

获取最高的高度展示

  • 1.先使用swiper组件将图片的框架搭建好(使用<image/>标签最好加个mode ="widthFix")
  • 如果图片是动态生成的的,按以下步骤走

    • 2.由于高度不一致,需通过wx.createSelectorQuery()获取每一张图片的属性(重点是高度)
    • 3.因为框架初始要渲染,所以将代码写在onReady钩子里面
    • 4.定义一个存放图片节点的空数组,因为要全局使用,需放在page上方
    • 5.要获取图片存储的选择器,获取图片的属性(id 选择器是一对一,类选择器是选全部)
    • 6.swiper本身有一个current属性,需在data中初始化
    • 7.定义一个数组,将获取到的图片节点信息res[0]存放在里面,为防止报错最好 || 初始值(数组[],对象 null)
    • 8.current 要动态获取
    • 9.判断是否有图片,有的话就将定义的数组赋值给图片节点存放的数组
    • 10.获取到图片的高度,首先要在data初始化,然后然后动态传递给初始化变量
    • 11.查看显示的长度是否异常(从执行的函数开始往下找)
    • 12.异步,使用延时器加载
  • 图片非动态的直接使用css样式和mode来控制

其他文章
cover
微信小程序-sku算法
  • 24/11/04
  • 09:57
  • 微信小程序
目录导航 置顶
  1. 1. 获取最高的高度展示
    1. 1.1. 如果图片是动态生成的的,按以下步骤走
    2. 1.2. 图片非动态的直接使用css样式和mode来控制
请输入关键词进行搜索