one-to-one路由不刷新，如何让view刷新

遇到的问题

在公司干开发的时候遇到一个这样的问题，这一年还是我做为实习生的时候，有一天产品叫我实现一个功能大概就是用户点击了以后页面操作的状态由这样变那样（看下面的图），其实需求也很简单了，就相当于这个查看会变成编辑操作，但是呢测试的时候测试突然跑过来和我说不对，没有改变，一开始我以为接口问题数据没有改变，然后我就高兴的去看接口，发现接口的数据已经改变了，但是为什么页面没有显示对应的操作呢？

解决

于是我就去用原生的JavaScript去刷新页面location.reload();强制刷新页面，果然可以。但是呢体验又不太好，会造成页面短暂的空白。

于是我就上网查，让我发现了原因，原来vue用户点击当前高亮的路由并不会刷新 view，因为 vue-router 会拦截你的路由，它判断你的 url 并没有任何变化，所以它不会触发任何钩子或者是 view 的变化。了解了原因就知道怎么去解决

第一种方法

通过定义一个指令来让表格组件先处于加载状态接口请求成功再显示数据，因为我公司同事封装了这个指令，所以这个是最快，最好的效果。但是根本就是让表格再渲染一遍

方法二

这是我当时实现的方法，当时没想到第一种方法，后面我就baidu让我在网上找到一种方法，如果你的项目这样的效果很多还是很划算的，如果不多，建议使用1或3方法。

最后要在使用的函数里面this.reload();就可以实现刷新了。

方法三

其实第三种方法就是在router里面query一个不同的值，这里引用一下 一个老师的文档图片