场景，hash的变化。Vue+Element实现管理页面的菜单栏。单击菜单时，路由器会更改散列以访问不同的子组件。但是hash改变后，菜单栏的展开状态和高亮不会同步，需要手动实现。TryTrySee的第一反应是通过onhashchange监听hash变化，将location.hash.slice(2)推送到菜单的default-active。此时手动输入url或者前进后退可以正常加载相应的状态，但是通过组件中的链接访问时，菜单的状态并没有改变。添加了alert验证，发现没有触发hashchange。WhySeafault的解释是Vue-Router底层调用了history.pushState。查阅MDN，发现pushState()永远不会触发hashchange事件，即使新URL与旧URL仅在哈希上不同。SolutionVue-Router的文档给出了两种解决方案watch$routeobjectconstUser={template:'...',watch:{$route(to,from){//对路由变化做出反应...}}}使用beforeRouteUpdateconstUser={template:'...',beforeRouteUpdate(to,from,next){//对路由变化做出反应...//别忘了调用next()}}此时还有最后一个问题，当直接用哈希访问路径时，菜单的状态不对，设置一个变量activePath来控制default-active在created()中添加this.activePath=location.hash.slice(2)构建元素时修改另外，菜单状态的原组件实例将被重复使用。因为两条路线都渲染相同的组件，所以重用比销毁和重新创建更有效。然而，这也意味着组件的生命周期钩子将不再被调用。
