我正在使用 Vue.js。我有一个组件，用户可以在其中保存数据。但是有可能用户没有保存数据，他试图导航到其他路线或破坏组件。我想显示一条消息，指出有未保存的数据，用户真的想不保存它。
如果用户说他不想留下未保存的数据，那么我必须停止导航或组件的破坏。我正在使用beforeDestroy 检查是否有未保存的数据并且它可以工作，但我无法停止破坏组件或导航。我尝试使用beforeRouteLeave，但它不起作用。关于如何完成这项工作的任何想法？
【问题讨论】：
stopping user 它是关于当用户路由到下一个组件时停止，请正确阅读问题并提出答案。
标签： vue.js vuejs2 vue-component vue-router vuex
嗯，我明白了，你确定以这种方式使用beforeRouteLeave
beforeRouteLeave (to, from , next) {
const answer = window.confirm('Do you really want to leave? you have unsaved changes!')
if (answer) {
next()
} else {
next(false)
}
}
键是next(false)
您需要将false 作为next() 中的参数传递，这样它就不会转发到下一个路由。
只需要检查它是否正确使用。
【讨论】：
console.log(to, from); 并分享其价值。
beforeRouteLeave，它在那里被调用。以前，当我在子组件中使用它时，它甚至从未被调用过。但是现在，还有一个问题。子组件的beforeDestroy 比路由组件的beforeRouteLeave 执行得晚。所以我的路由组件不知道子组件中是否有未保存的数据。
this current vm，因此您可以访问当前组件的所有详细信息并检查是否有未保存的数据。