测试之vuejs

用vuejs 构建一个单页面应用，单页面应用页面包括，头部，左侧导航，中间内容区域，如图1所示：

图1

要求：1.当左侧导航栏列表过多的时候，出现滚动条，右侧内容超出的时候右侧出现滚动条。如图2,3所示，点击左侧列表的时候，右边内容变成左侧菜单的字，如点击“左侧1”，右侧中间布局就变成“这是左侧1”,并且相应点击的li加上背景颜色，如图4所示：

注意事项：1左侧和中间布局高度默认跟浏览器窗口的高度一样，超出的时候才出现滚动条。2.点击左侧列表，通过路由来加载不同的组件。

左侧滚动条

图2

右侧滚动条

图3

图4

参考资料：https://vuejs.org/

http://router.vuejs.org/