vue页面重新加载功能 - 错误

Posted 2023-02-16

【中文标题】vue页面重新加载功能 - 错误

【英文标题】：vue page reload function - errpr

【发布时间】：2021-12-26 14:10:55

【问题描述】：

我想构建一个简单的函数，如果 route.name 为 Idx，则将浏览器转发到特定目的地，如果不是，则重新加载页面。我使用以下代码并得到以下错误

我使用 vue 2-x。

代码

reloadPage() 
    if (this.$route.name == "Idx") 
        this.$router.push('/')
        //console.log("test")
     else 
        this.$router.go() // RELOAD THE PAGE TO OVERTAKE THE CHANGES
                

错误

未捕获（承诺）NavigationDuplicated：避免冗余 导航到当前位置：“/idx”。

仅当我在 /idx 站点中运行该函数时才会出现此错误。

我错过了什么？

谢谢！

【问题讨论】：

window.location.reload();

嘿亚当，谢谢，但如果我用 window.location.reload(); 替换 this.$router.go();该页面根本不会重新加载....当我将 this.$router.go() 放在一个额外的函数中时它可以工作，但这并不好看

【参考方案1】：

如果您的应用程序没有因此错误而中断，我能想到的一种解决方案是处理承诺。

reloadPage() 
if (this.$route.name == "Idx") 
    this.$router.push('/').catch(()=>);
    
 else 
    this.$router.go() // RELOAD THE PAGE TO OVERTAKE THE CHANGES
            

另外，我尝试在 vue3 中运行相同的逻辑并没有遇到此异常，我认为他们摆脱了相同的路线导航。

confirmInput() 
  // do something
  console.log('test', this.$router.currentRoute.value.path);
  if (this.$router.currentRoute.value.path === '/myroute') 
    this.$router.push('/');
   else 
    this.$router.go();
  
,

【讨论】：

谢谢鲁本，第一个答案对我有用，我会记住第二个解决方案，因为我很快就会切换到 vue3。