想实现点击左侧 级别,右侧跟随滚动,但是试了几次均未实现,下面附上demo

wxml

<scroll-view scroll-y="true" scroll-into-view="{{toView}}"  style="height: 6000px;">  

<view id='{{item.wordindex}}' class="brand" wx:for="{{brandList}}" >  

<view class="line"></view>  

<view class="wordindex">{{item.wordindex}}</view>  

<view class="line"></view>  

<view class="brand_block">  

<view class="color_view" wx:for="{{item.brand}}" bindtap="click">  

<image src="{{item.brandimg}}"></image>  

</view>  

</view>  

</view>  

</scroll-view>  

<view class="index">  

<text wx:for="{{wordindex}}" bindtap="choiceWordindex" data-wordindex="{{item.wordindex}}">  

{{item.wordindex}}

</text>  

</view>

wxss

/* pages/order/car/add_car/car_brand/car_brand.wxss */  

scroll-view {

height: 600px;

float: left;

width: 94%;

}

.wordindex {

line-height: 50rpx;

background: #f7f7f7;

font-size: 14px;

color: #929292;

padding-left: 28rpx;

}

.color_view {

text-align: center;

display: inline-flex;

flex-direction: column;

}

.brand_block {

margin-top: 28rpx;

margin-left: 28rpx;

}

image {

width: 140rpx;

height: 140rpx;

margin-right: 24rpx;

margin-bottom: 24rpx;

border-style: solid;

border-width: 1rpx;

border-color: #ededed;

}

.index {

float: right;

position: fixed;

right: 0;

margin-top: 20%;

margin-right: 10rpx;

color: #e0004a;

font-size: 11px;

}

.index text {

display: flex;

line-height: 18rpx;

}

js

var app = getApp()

Page({

data: {

"brandList": [],

"wordindex": [],

"toView": 'a',

},

onLoad: function (options) {

var that = this;

that.setData({

brandList: [{ wordindex: 'a' }, { wordindex: 'b' }, { wordindex: 'c' }, { wordindex: 'd' }, { wo