首页 > 解决方案 > Fetch() 中的 Nuxt 和 $auth

问题描述

我的 $auth 有问题...

在一个页面中,我必须验证 $auth.loggedIn 值。

<template>
   {{ this.$auth.loggedIn }}
</template>
<script>
   export default{
       async fetch(){
          if(this.$auth.loggedIn){
            console.log('User connected')
          }else{
            console.log('User not connected')
          }
       }
    }
</script>

我的模板中的第一个 $auth.loggedIn 显示为 TRUE(没关系),但我的 console.log 显示“用户未连接”...

怎么可能?看来我对 $router / $route 变量有同样的问题......

非常感谢!文森特

标签: authenticationfetchnuxt.js

解决方案


fetch在渲染路由时在服务器端调用,在导航时在客户端调用。

因此,如果它正在渲染您的路线,它会在服务器端初始化,并且由于this.$auth仅在客户端可用,因此无法访问它。

尝试通过访问它app

async fetch ({ app }) {
      if(app.$auth.loggedIn){
        console.log('User connected')
      }else{
        console.log('User not connected')
      }
}

关于参数问题,您可以访问如下:

async fetch ({ params }) {
        console.log(params.id)
}

或者

async fetch ({ route}) {
        console.log(route.params.id)
}

推荐阅读