小程序内容滚动导航体验提升

滚动导航 在商城小程序中是非常常见的
当scroll-view 超出宽度时 滑动滑块 双向联动 样式很可能不在中间在这里插入图片描述

实现业务逻辑
1.滚动区域
2.内容滑块
3.双向联动
4.scroll-left
功能描述
通过scroll-view实现,一般都是会配合样式的动态改变 动态改变主要通过一个三项式来实现的 {{ index1 ==item.id ?‘active’:’’ }}
实现了滚动区域之后和动态样式之后
接下来实现的是 swiper滑块部分 然后 通过swiper的current属性和 动态样式的index1的对接来实现双向绑定
接下来需要做的是 用户的体验提升 也就是说让动态显示的样式一直处在屏幕中

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值