微信小程序 swiper 自定义组件

实现功能

点击tab 轮播跟这改变
切换轮播 tab选中值相应改变
轮播内容按照内容高度自适应（默认150px）
slot功能自定义每一个轮播的内容

使用方法

<myswiper currentTab='{{currentTab}}' swiperList="{{itemList}}"  TabList="{{TabList}}" bindtabListChange="tabListChange" bindswiperListChange="swiperListChange"><view slot="list0" wx:if="{{currentTab==0}}" class="swiper_list_item"></view><view slot="list1" wx:if="{{currentTab==1}}" class="swiper_list_item"></view><view slot="list2" wx:if="{{currentTab==2}}" class="swiper_list_item"></view><view slot="list3" wx:if="{{currentTab==3}}" class="swiper_list_item"></view>
</myswiper>

属性解释

currentTab ：当前选中的tab string
swiperList ：需要渲染多少个轮播数组 （貌似改成数字更合适）
TabList ：tab切换的时候渲染的数据（传空不展示）
tabListChange ：点击tab事件返回值为点击的当前数据的所有值加点击下标
swiperListChange ：切换轮播回调事件返回值滑动后的下标
name slot 自定义展示内容用到不允许修改
class 获取高度用到不允许修改
wx:if 因为if 所以高度取得是第一个 swiper_list_item 的高（只会出现一个）

百度网盘链接

链接: https://pan.baidu.com/s/1fAtp6K-eBe5XVD5suM7bBw

提取码: rdnc

永久有效

微信小程序 swiper 自定义组件相关推荐

微信小程序配置自定义组件代码按需注入 lazyCodeLoading
微信小程序配置自定义组件代码按需注入 lazyCodeLoading 官方网址在app.json最后一行加上,就可以了. "lazyCodeLoading": "re ...
微信小程序的自定义组件（2）
文章目录 6. 组件的生命周期 7. 组件所在页面的生命周期 8. 组件插槽 9. 组件父子组件间的通信 10. 组件-behaviors 6. 组件的生命周期 created attached re ...
微信小程序（自定义组件）
文章目录自定义组件创建自定义组件引用组件组件和页面的区别自定义组件的样式样式隔离修改样式隔离选项组件的data和methods 组件的properties 数据监听使用纯数据字段提升 ...
微信小程序之自定义组件的使用、介绍、案例分享
微信小程序自定义组件介绍自定义组件发开文档类似vue或者react中的自定义组件, 小程序允许我们使用自定义组件的方式来构建页面. 自定义组件的使用 1. 创建组件(js,json,wxml,wx ...
微信小程序之自定义组件(微信小程序完结)
微信小程序自定义组件类似vue或者react中的自定义组件, 小程序允许我们使用自定义组件的方式来构建页面. 1.1 创建自定义组件类似于页面,一个自定义组件由 json, wxml, wxss ...
微信小程序中自定义组件
文章目录小程序项目 app.json pages/index/index.wxml pages/index/index.wxss pages/index/index.js 自定义组件 compone ...
微信小程序_自定义组件_初体验
自定义组件是微信小程序中重要的组成部分,是实现模块化开发的重要手段个人认为,自定义组件是区分菜鸟与高手的分水岭第一篇先介绍小程序自定义组件的基本使用自定义组件的使用可以分为如下几个步骤创建组件 ...
【微信小程序】自定义组件的实现及数据交互
简单的自定义组件本文的使用场景是:多个页面都需要用到拨打电话功能,为减少代码量.便于维护,所以自定义了一个组件,每个页面直接调用即可.基本实现下图样式: 下面我们来一步步的实现它: step1:创建 ...
微信小程序 - 在自定义组件中请求后端 API 数据接口（引入该组件的页面触发）组件在哪个生命周期钩子函数中请求接口数据呢？
前言我开发了一个 A 页面,然后在 A 页面引入了一个组件 B ,我想在 B 组件中加载进来的时候执行一个后端请求,获取数据进行 B 组件渲染. 今天遇到这么一个问题,我写好的小程序组件(comp ...

微信小程序 swiper 自定义组件

微信小程序 swiper 自定义组件相关推荐

最新文章

热门文章