在小程序中为了实现一个<swiper-item>中添加多个内容重复的标签,那就需要使用wx:for循环。如果按小程序的简易教程,循环加在block中,而swiper-item放在里面。所有数据都会遍历到每一个swiper-item中。这不是我们想要的。

只需要把<block>放入<swiper-item>中就可以,把循环数据绑定到block上就可以了。

代码:

<!--导航部分轮播图-->
<swiper class="navban" indicator-dots="{{indicatorDots}}" interval="{{interval}}" duration="{{duration}}">
<swiper-item>
<block wx:for="{{navimg}}">
<view class="navbox">
<image class="navimg" src="{{item}}"></image>
<text class="navtext">掌上信息</text>
</view>
</block>
</swiper-item>
</swiper>

效果:

微信小程序中在swiper-item中遍历循环添加多个数据内容(微信小程序交流群:604788754)的更多相关文章

  1. vue中引入swiper(vue中的滑块组件vue-awesome-swiper)

    第一步安装 npm install vue-awesome-swiper --save 第二部在main.js中引入 import VueAwesomeSwiper from 'vue-awesome ...

  2. Java中使用自定义类封装数组,添加类方法实现数据操作

    1.具体见注释 2.后续或有更新 public class MyArray { private long[] array; private int cnt; // 自定义数组类的元素个数 /** 使用 ...

  3. 小程序开发基础-swiper 滑块视图容器

    小编 / 达叔小生 参考官方文档:https://developers.weixin.qq.com/miniprogram/dev/component/ 小程序开发基础-swiper 滑块视图容器 根 ...

  4. 【转载】C#中AddRange方法往ArrayList集合末尾添加另一个集合

    ArrayList集合是C#中的一个非泛型的集合类,是弱数据类型的集合类,可以使用ArrayList集合变量来存储集合元素信息,任何数据类型的变量都可加入到同一个ArrayList集合中,如果需要往一 ...

  5. 【转载】 C#中ArrayList使用GetRange方法获取某一段集合数据

    在C#的编程开发中,ArrayList集合是一个常用的非泛型类集合,可以使用GetRange方法来获取集合中指定索引位置开始的一整段集合数据组成一个新的集合,GetRange方法的签名为virtual ...

  6. 微信小程序的坑(持续更新中)

    参与微信小程序开发有一段时间了,先后完成信息查询类和交易类的两个不同性质的小程序产品的开发:期间遇到各种各样的小程序开发的坑,有的是小程序基础功能不断改进完善而需要业务持续的适配,有的是小程序使用上的 ...

  7. 微信小程序——动态设置swiper的高度

    根据小程序的设定,swiper组件默认高度为150px,无法根据内容来撑高.如果里面的内容固定还好说,直接设置一个高度就可以了.要是里面内容是动态变化的,这个特性使得我们使用这个组件的时候感到诸多不便 ...

  8. Native Application 开发详解(直接在程序中调用 ntdll.dll 中的 Native API,有内存小、速度快、安全、API丰富等8大优点)

    文章目录:                   1. 引子: 2. Native Application Demo 展示: 3. Native Application 简介: 4. Native Ap ...

  9. 小程序实践(五):for循环绑定item的点击事件

    微信展示列表效果借助于 wx:for  简单写一个列表(wxml文件中): 对应的数据源(js文件中): 写一个点击监听: 效果: 以上.可以实现列表的item点击效果,但是无法到点击的item对应的 ...

随机推荐

  1. 解决ubuntu更新中断后报错问题

    今天在更新ubuntu的时候,更新了一半被我强制关闭了,就报错了 当再使用sudo apt-get update命令时出现了dpkg was interrupted,you must manually ...

  2. Hibernate中遇见的问题

    1.在用Hibernate写增删改查时,有两种方式:a.HQL语句,b.原生态sql语句 如果我要执行的语句是:select * from Question HQL是这么写的: Session ses ...

  3. LVS的原理介绍

    DR模式  LVS 的VIP 和 realserver 必须在同一个网段,不然广播后所有的包都会丢掉: 提前确认LVS/硬件LB 是什么模式,是否需要在同一个网段 所有的realserver 都必须绑 ...

  4. MVC学习笔记1-MVC家族间的区别

    ASP.NET下的MVC从原始的1.0走到2.0,再到3.0,现在走到4.0,也许明年5.0就问世了,先不管那些,那说说这些MVC在ASP.NET是如何变化发展的.对于.net编程人员来说可能会很熟悉 ...

  5. 深入React组件生命周期

    上篇博文使用React开发的一些注意要点对React开发的一些重点进行了简单的罗列总结,虽然也提到了React生命周期,但只略微小结,在此单独写篇React生命周期的总结. 在组件的整个生命周期中,随 ...

  6. dotweb——go语言的一个微型web框架(二)启动dotweb

    以上的代码截图表示启动一个dotweb服务,在浏览器里输入127.0.0.1:8080,将会得到一个"index"的页面. app := dotweb.New() dotweb.N ...

  7. MCMC(四)Gibbs采样

    MCMC(一)蒙特卡罗方法 MCMC(二)马尔科夫链 MCMC(三)MCMC采样和M-H采样 MCMC(四)Gibbs采样 在MCMC(三)MCMC采样和M-H采样中,我们讲到了M-H采样已经可以很好 ...

  8. String 类的实现(1)浅拷贝存在的问题

    浅拷贝 : 也称位拷贝 , 编译器只是直接将指针的值拷贝过来, 结果多个对象共用 同 一块内 存, 当一个对象将这块内 存释放掉之后, 另 一些对象不知道该块空间 已经还给了 系 统, 以 为还有效, ...

  9. 自适应滤波:奇异值分解SVD

    作者:桂. 时间:2017-04-03  19:41:26 链接:http://www.cnblogs.com/xingshansi/p/6661230.html 声明:欢迎被转载,不过记得注明出处哦 ...

  10. 【转】轻应用、Web App、Native App三者分别是什么?

      一.什么是Native app Native App是一种基于智能手机本地操作系统如IOS.Android.WP并使用原生程式编写运行的第三方应用程序,也叫地app.NativeApp因为位于平台 ...