swiper 组件高度被限制为150px了,所以内容无法撑开。

解决办法

给这组件重新设置个高度,然后在把里面的图片设置为自动适应容器大小。图片模式设置为 宽度不变 自动适应高度

<swiper class="test" .....>
<swiper-item>
<image mode='widthFix' ...... />
</swiper-item>
</swiper> <style>
.text{
  height:200px;
}
image{
width:100%;
height:auto;
}
</style>

微信小程序 swiper 组件坑的更多相关文章

  1. 基于angular实现模拟微信小程序swiper组件

    这段时间的主业是完成一个家政类小程序,终于是过审核发布了.不得不说微信的这个小程序生态还是颇有想法的,抛开他现有的一些问题不说,其提供的组件系统乍一看还是蛮酷的.比如其提供的一个叫swiper的视图组 ...

  2. 微信小程序--swiper组件

    <view class='swiper-container'> <swiper indicator-dots="true" autoplay=" ver ...

  3. 第五篇、微信小程序-swiper组件

    常用属性: 效果图: swiper.wxml添加代码: <swiper indicator-dots="{{indicatorDots}}" autoplay="{ ...

  4. 微信小程序 image组件坑

    远程图片 在真机上测试时 image组件只能显示http请求的图片, 对https 与 //xxx.xxx.xx 之类的不能显示. 可显示 'http://img.alicdn.com/i2/8323 ...

  5. 微信小程序swiper组件实现图片宽度自适应

    wxml 代码: <!--pages/swipe/swipe.wxml--> <view> <swiper circular="true" indic ...

  6. 微信小程序_(组件)swiper轮播图

    微信小程序swiper轮播图组件官方文档 传送门 Learn: swiper组件 一.swiper组件 indicator-dots:是否显示面板指示点[默认值false] autoplay:是否自动 ...

  7. 微信小程序的组件总结

    本文介绍微信小程序的组件 视图容器 基础内容 表单组件 导航组件 媒体组件 视图容器 view 布局容器 <view hover-class='bg'>222</view> 可 ...

  8. 微信小程序swiper实现 句子控app首页滑动卡片

    微信小程序swiper实现 句子控app首页滑动卡片 引言:最近看到句子控APP首页的效果很清新,可是发现他的微信小程序端没有实现这个功能,我看了一下难度不大,于是尝试着去实现. 实现效果如下: 1. ...

  9. 我的微信小程序入门踩坑之旅

    前言 更好的阅读体验请:我的微信小程序入门踩坑之旅 小程序出来也有一段日子了,刚出来时也留意了一下.不过赶上生病,加上公司里也有别的事,主要是自己犯懒,就一直没做.这星期一,赶紧趁着这股热乎劲,也不是 ...

随机推荐

  1. [转]在CentOS安装CMake (CentOS7 64位适用)

    一.环境描述 1.系统:CentOS 6.4 i386 (min) 2.登录用户:root 3.版本:CMake 2.8.10.2 4.虚拟机:Oracle VM VirtualBox 二.安装步骤 ...

  2. OctetString 转String

    /// <summary> /// OctetString转时间 /// </summary> /// <param name="ss">字符串 ...

  3. 泡泡一分钟:Robust and Fast 3D Scan Alignment Using Mutual Information

    Robust and Fast 3D Scan Alignment Using Mutual Information 使用互信息进行稳健快速的三维扫描对准 https://arxiv.org/pdf/ ...

  4. 转 移动云基于MySQL Galera的PXC运维实战

    ##sample 1 : mysql 监控 1.phpadmin  比较简单,适合上手 2.mysql_web python 写的, https://github.com/ycg/mysql_web/ ...

  5. 转 ORA-13541: system moving window baseline size (691200) greater than retention (432000)

    修改awr生成报告时间间隔和保存时间时报错,由默认的每小时生成,保存8天修改为每半个小时生成一次,保存5天: SQL> exec dbms_workload_repository.modify_ ...

  6. spring 装配bean的混合使用

    在现实中,使用XML或者注解各有道理,建议在自己的工程中所开发的类尽量使用注解方式,因为使用它并不困难,甚至可以说更为简单,而对于引入第三方包或者服务的类,尽量使用XML方式,这样的好处是可以尽量对三 ...

  7. go micro rpc 直接调用 返回500 错误

    开启网关时需要 加上 flags micro api -handle=api --enable_rpc

  8. REDIS类和方法说明

    package zhengxin.core;   import redis.clients.jedis.Jedis; import redis.clients.jedis.JedisPool; imp ...

  9. H5 video安卓默认点击不能全屏播放解决办法

    调用方法: autoFullScrenn(obj) 还有一篇: 使用MediaElement.js构建个性的HTML5音频和视频播放器 var fullscreen = function(elem) ...

  10. windows命令行 共享文件夹

    net share dpantemp2 /DELETEnet share dpantemp2=d:\temp2 /GRANT:jk,FULL /REMARK:" web api 共享&quo ...