V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
vue.js
zzlit
V2EX  ›  Vue.js

求教 vue3 中使用 vue-router 的导航守卫问题

  •  
  •   zzlit · 72 天前 · 764 次点击
    这是一个创建于 72 天前的主题,其中的信息可能已经有所发展或是发生改变。

    app.vue 代码如下

    <template>
      <router-view />
    </template>
    
    <script lang="ts">
    import { defineComponent } from 'vue';
    import { onBeforeRouteLeave } from 'vue-router';
    
    export default defineComponent({
      name: 'App',
      setup() {
        onBeforeRouteLeave((to, from) => {
          console.log('onBeforeRouteLeave', to, from);
        });
      }
    });
    </script>
    

    跑起来控制台有警告,同时也不会触发 onBeforeRouteLeave 这个事件

    [Vue Router warn]: No active route record was found. Are you missing a <router-view> component?

    然后放到页面内能触发,但是同样也会有警告:

    [Vue warn]: Avoid app logic that relies on enumerating keys on a component instance. The keys will be empty in production mode to avoid performance overhead.

    请问大佬们这该怎么解决?

    3 条回复    2021-08-06 16:08:17 +08:00
    lupkcd
        1
    lupkcd   71 天前
    应该写在 <router-view /> 里面的组件才行吧,没试验,盲猜的
    shakukansp
        2
    shakukansp   71 天前   ❤️ 1
    https://stackoverflow.com/questions/68100114/avoid-app-logic-that-relies-on-enumerating-keys-on-a-component-instance

    学会搜 warning
    如果没有就下载 vue3/vue-router 源码搜 warning,里面都能知道什么情况会出这个 warning
    zzlit
        3
    zzlit   71 天前
    @shakukansp 受教了
    关于   ·   帮助文档   ·   FAQ   ·   API   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   2045 人在线   最高记录 5497   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 16ms · UTC 11:11 · PVG 19:11 · LAX 04:11 · JFK 07:11
    ♥ Do have faith in what you're doing.