先完成‘左右两列竖直分别滑动,相互之间不存在任何关联’的页面样式:
<t
emplate>
<div>
<div class="flex-between">
<div class="left">
<span v-for="n in 16" :key="n">{{n}}</span>
</div>
<div class="right">
<span v-for="m in 8" :key="m">{{m}}</span>
</div>
</div>
</div>
</template>
<style scoped>
.left, .right{
overflow-y: auto;
height: 667px;//高度是指滚动窗口的高度,必须有
}
.left{
width: 20%;
}
.right{
width: 80%;
}
.left span{
background: forestgreen;
}
.right span{
background: red;
height: 300px;
}
</style>