使用小程序bindscroll实现联动
-
需求分析
要求实现的功能是左侧展示分类名,右侧展示商品,点击任意分类可以跳转分类所包含的商品的第一个,滑动商品列表至下一分类时左侧所属分类高亮。 -
思路
首先实现点击左侧分类右侧商品滑动,这里使用小程序提供的 scroll-into-view方法,官方文档
https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html
右侧商品滚动页的框
<scroll-view scroll-y='true' style="height:784rpx" scroll-with-animation="true" scroll-into-view="m_{
{toView}}" bindscroll='scroll'>
<view id=' m_1'></view>
<view id=' m_2'></view>
</scroll-view>
其他先不管 这里只看scroll-into-view="{ {toView}}" 他代表这一滚动页,滚动到 其下id为toView的组件,在左侧用bindtap=‘clickMenu’ 实现对toView的动态控制,
//分类栏的wxml代码,