ElementUI确认框不等待导航钩中的响应

Question

我的路由器具有以下结构：

const router = new VueRouter({
  routes: [
    { path: '/',
      component: Parent,
      redirect: '/parent',
      children: [
        {
          name: 'children1',
          path: '/children1',
          component: childrenComponent,
        },
        {
          name: 'children2',
          path: '/children2',
          component: childrenComponent2,
        },

在childrenComponent2上，我在beforeRouteLeave消息框中添加了this.$confirm钩子。

beforeRouteLeave(to, from, next) {
  this.$confirm('Are you sure you want to navigate away from this page?', 'Warning',
  ).then(() => {
    next();
  }).catch(() => {
    next(false);
  });
},

但是，this.$confirm无法正常工作。它仅显示0.5秒，而无需等待用户输入。如果我将其替换为window.confirm，它将正常工作。 如何处理？为什么这不等待我的选择，而是立即尝试导航（无结果，它更改了url，但不呈现视图）？

谢谢