<view class="cateContainer" id="view1" :style="'height:'+scrollHL +'px'">
		<scroll-view scroll-y class="scrollContainer"  id="viewLeft"  >
			<view class="scroll-view-item" v-for="cate,cateIndex in cateGoryList" :key="cate.cat_id">
				<view class="itemLeft" @click="changeCateIndex(cateIndex)"
					:class="{backgroundColor:cateIndex == cateIndexData}">
					<span :class="{borderLeftRed:cateIndex == cateIndexData }">{{cate.cat_name}}</span>
				</view>

			</view>
		</scroll-view>

		<scroll-view scroll-y class="rightContainer"  id="viewRight">
			<view class="rightItem" v-for="rightItem,rightItemIndex in cateGoryList[cateIndexData].children"
				:key="rightItem.cat_id">
				<view class="rightTop">
					/{{rightItem.cat_name}}/
				</view>
				<view class="right-bottom">
					<view class="bottomItem" v-for="bottomItem,bottemItemIndex in rightItem.children"
						:key="bottomItem.cat_id">
						<image :src="bottomItem.cat_icon"></image>
						<view class="bottomText">
							{{bottomItem.cat_name}}
						</view>
					</view>
				</view>
			</view>
		</scroll-view>
	</view>

        data() {
			return {
				
				scrollHL:0
			};
		},
		onLoad() {
				
				// 动态绑定滚动条的高度
				// 先取出页面的高度				
				let pageHeight = uni.getSystemInfoSync().windowHeight
				// 用selector
				let query = uni.createSelectorQuery().in(this)
				query.select('#view1').boundingClientRect()	
                //保存组件变量，回调函数才能引用到						
				var that = this;
				query.exec(function(res){
					let topHeight = res[0].top;
					// 滑动滚动条的高度等于整个页面的高度 - 页面距离上面的高度
					let scrooViewHeight = pageHeight  - topHeight;
					// 保存到高度信息当中。
					that.scrollHL = scrooViewHeight					
				})									
				// 这是px单位。 rpx是px的2倍
		},
}