微信小程序scroll-view联动滚动

前言

在做微信小程序的时候，需要用到联动滚动，类似于美团的点餐，在网上搜了很多，发现不是很全，在这里自己总结一下

scroll-view

如果想要实现纵向滑动，除了设置scroll-y为true，还必须设置固定高度，只有内容高度大于你所设置的高度的时候才会出现滚动
scroll-into-view联动左右区域的内容，可以实现同步滚动效果
scroll-with-animation在设置滚动条位置时使用动画过渡，详情见微信官方文档：https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html

// 左部标题区
<scroll-view scroll-y='true' class='aside-left' style='height:{
      {
      height-85}}px;' scroll-into-view="{
    {
    'inToview'+rigId}}" scroll-with-animation="true"><view wx:for="{
  {aside}}" wx:key class='aside-tip {
  {classfiySelect == item.id?"selected":"unselect"}}' data-id='{
  {item.id}}'bindtap='left_list'>{
  {item.name}}</view></scroll-view>
// 右部内容区
<scroll-view class="aside-right" scroll-y='true' style='height:{
      {
      height-65}}px;' bindscroll="scroll" scroll-top="{
    {scrollTop}}" scroll-into-view="{
    {
    'inToview'+rigId}}" scroll-with-animation="true">
  <view class='part' wx:for="{
    {detail}}" wx:key id="{
    {
    'inToview'+item.id}}">
    <view class='main-tip'