需求:实现类似美团外卖。
1.点击左侧菜单右侧滚动到对应内容。
2.滚动右侧内容左侧对应菜单高亮。
一、首先介绍下scroll-view
可滚动视图区域。案例用到如下属性(如需了解更多请访问官网https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html):
以下属性1.0.0版本即可
<!--pages/order/index.wxml-->
<view class="container" style="background:#ebebeb;">
<view class="p-10">
<scroll-view scroll-x>
<view class="scroll">
<view class="item">
<image src=""/>
</view>
<view class="item">
1
</view>
<view class="item">
1
</view>
<view class="item">
1
</view>
<view class="item">
1
</view>
<view class="item">
1
</view>
<view class="item">
1
</view>
<view class="item">
1
</view>
</view>
</scroll-view>
</view>
</view>
.scroll{
white-space: nowrap;
}
.scroll .item{
width:100px;
height:100px;
display: inline-block;
}
标签:滚动,微信,100px,https,scroll,view From: https://www.cnblogs.com/sathcal/p/18536459