vue-router:防止在参数更改时路由

Uni*_*rgy 5 javascript vue.js vue-router vuejs2

我正在尝试确认离开未保存的路线,如果用户拒绝,则取消更改路线.

它主要用于

beforeRouteLeave: function (to, from, next) { 
                      if (!confirm('Leaving form')) next(false);
                   }
Run Code Online (Sandbox Code Playgroud)

问题在于路由参数,比如#/form-path?id=5- 更改id参数不会触发beforeRouteLeave.

我可以使用哪个钩子来防止参数更改导航?

Ras*_*leh 1

动态路由匹配是专门为了使不同的路径或URL映射到相同的路由或组件而设计的。因此,改变参数在技术上并不算是离开(或改变)路线,因此beforeRouteLeave不会被解雇。

不过,我建议可以让与路由对应的组件负责检测参数的变化。基本上,每当参数发生变化时,记录更改然后反转它(希望反转足够快以至于用户不会注意到),然后要求确认。如果用户确认更改,则使用您的记录来“取消”更改,但如果用户未确认,则保持原样(不要取消相反)。

我没有亲自对此进行测试,因此我不保证它能够工作,但希望它能够消除关于应用程序的哪一部分负责检查哪些更改的任何混乱。