在开发中常常会遇到这样一个vue页面，页面分为左右两部分，左边是目录树，右边是一个类名为xq-box的div，在xq-box中多个div上下并列布局，每个div中的内容就对应着左边目录树中的相应节点，现在的目标是，要监听这个xq-box滚动事件，右边一旦开始滚动，就要知道滚动到哪个子div，并让左边的目录树中对应的节点高亮显示。要怎么做呢？
1、首先，先写好大概的页面布局，这里要注意，右边xq-box的子div要绑定"'xqItem'+序号"的id，为了下面用js能获取到匹配的dom元素：
![]()
{{ menu.name }}
{{ item.name }}
{{ item.content }}
2、然后，在css里给xq-box高度，设置其超出能滚动：