<ul class="collapse navbar-collapse nav nav-pills navbar-nav top-menu">
<li v-for="item in topMenus">

<a @click="toPath(item.note)"
:class="{ 'active': item.note === data.currentPath }">
{{item.name }}
</a>

</li>
</ul>

我以前写的一个

// 刷新时自动显示当前tab
var showTab = window.location.hash;
if (showTab.indexOf("#")==0) {
    $(".tab-content").hide();
    $(showTab).show();
    // footer上的链接跟着变成active
    $(".header .tab-nav a").each(function() {
        if ($(this).attr('href') !== showTab) {
            $(this).removeClass('active');
        }
        else{
            $(this).addClass('active');
        }
    });
}

把状态用vuex记录下？

有个办法，就是点击左边导航栏时加上hash值，刷新后根据hash，JS控制刷新之前的状态

最优雅的方式

1. 使用vuex记录状态

2. 将vuex store储存到localStorage

3. 刷新页面之后读取localStorage初始化vuex store

这样方便维护 代码可读性高