mpvue微信小程序怎么写轮播图,和官方微信代码的差别
2024-08-30 16:43:53
目前用mpvue很多第三方的ui库是引入不了的,因为它不支持含有dom操作。
那我们要做轮播图的话一个是手写另外一个就是用小程序的swiper组件了:
官方代码:
<swiper indicator-dots="{{indicatorDots}}"
autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}">
<block wx:for="{{imgUrls}}">
<swiper-item>
<image src="{{item}}" class="slide-image" width="355" height="150"/>
</swiper-item>
</block>
</swiper>
mpvue微信代码:
<swiper class="swiper" indicator-dots="true" autoplay="true" interval="5000" duration="1000">
<block v-for="(item, index) in movies" :index="index" :key="key">
<swiper-item>
<image :src="item.url" class="slide-image" mode="aspectFill"/>
</swiper-item>
</block>
</swiper>
注意我们改动的几个地方:
1.所有双括号是要去掉的,否则报错
2.wx:for要改成v-for(后面一定要有:index和:key不然报错)
3.src的绑定要加冒号
4.最好加个:key="key",不加不会报错,但是有警告,看着不舒服。
原文链接:https://blog.csdn.net/weixin_39818813/article/details/80636875
最新文章
- ASP.NET获取客户端IP地址
- PYTHON 函数的普通参数
- 深入了解try catch
- linux下打包工具
- MyEclipse XFire Web Service
- js类型转化
- [LintCode] Segment Tree Build II 建立线段树之二
- 利用ddmlib 实现 PC端与android手机端adb forword socket通信(转)
- hdu 5045 费用流
- Apache Kafka系列(一)
- CCF系列之日期计算(201509-2)
- CentOS7 防火墙firewalld详细操作
- pig强制转换(字符到整数):首位0怎么处理,‘01’到1的转化,
- esnext:Function.prototype.toString 终于有规范了
- Redis基本概念、基本使用与单机集群部署
- 一起学Hadoop——MapReduce原理
- [leetcode]4. Median of Two Sorted Arrays俩有序数组的中位数
- 为什么 echo 3 . print(2) . print(4) . 5 . &#39;c&#39;的结果是45c2131
- Spring 自动定时任务配置
- angularjs路由相关知识