微信小程序:使swiper的高度沾满整个屏幕

swiper组件的高度默认是150px,设置高度100%也无法生效,因为外部的组件没有固定的高度,这时就需要通过js来过去屏幕的高度并给swiper设置

data:{
	swiperHeight: 0;//初始时swiper的高度是0
}
//监听页面加载
onLoad:function (option){
	let that = this;//将this另存为
	wx.getSystemInfo({
		success:functioin(res) {
			let clientHeight = res.windowHeight;
			let clientWidth = res.windowWidth;
			let ratio = 750 / clientWidth;//计算为百分比
			let rpxHeight = ratio * clientHeight;
			that.setDate({
				that.swiperHeight: rpxHeight;//将计算好的高度给定义好的值
				})
		}
 	})
}

将获取到的屏幕高度给swiper设置上

{{swiperHeight}}rpx">

**注意:**最后的rpx千万不能省略,否则不生效

你可能感兴趣的:(微信小程序功能实现)