今天在写项目的时候，需要实现一个二级路由页面点击按钮不切换整体页面布局，只更换路由内容的功能，我设置v-if 显示隐藏切换后，虽然可以实现AB两个页面之间的切换，但是却存在一个问题。也许我可以点击切换后的B页面，将隐藏的A原始页面v-if状态从false变回true，但是，如果点击浏览器回退按钮，虽然可以回退到原始A页面，但其内容仍然处于隐藏状态，感官非常不好。
还出现了该报错：
Avoided redundant navigation to current location
经过我多方查找资料（baidu），查看文档后，发现了一些大佬的回答非常有用。
使用
router-view时，如果在相同路由之间跳转，默认在跳转路由时会采用缓存策略,并不会刷新当前路由组件。即mounted,beforeDestory等钩子函数并不会触发。
如果想强制刷新，可以在根路由上为其分配一个唯一key。采用
$route.fullpath作为其唯一key。这样vue就回认为内部路由每个都是不同的路由，在跳转时便会强制刷新组件
救命恩人呀！ 特此记录
`
<el-card class="box-card" v-if="isShow">
<!-- 头部标题 -->
<div slot="header" class="clearfix">
<span>文章列表</span>
</div>
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-row :gutter="20">
<!-- 左边内容 -->
<el-col :span="22" label-width="80px" >
<!-- 文章分类下拉框 -->
<span class="sortArticle">文章分类:</span>
<el-select v-model="value" clearable placeholder="文章分类" >
<!-- 略 -->
</el-select>
<!-- 两个按钮 查询 重置 -->
<el-form-item>
<el-button type="primary" style="margin-left:10px">查询</el-button>
<el-button >重置</el-button>
</el-form-item>
</el-col>
<!-- 左边内容结束 -->
<!-- 右边内容 发布文章按钮 -->
<el-col :span="2">
<el-button type="primary" @click="gotoAddArticle"><router-link to="/addarticle">发布文章</router-link></el-button>
</el-col>
</el-row>
</el-form>
<!-- ---------头部第二层具体内容结束-------------- -->
