0
426
VistasLa propiedad Vue 3 Object devuelve indefinido
¿Cómo extraer otros atributos del objeto Keycloak? En este momento,
si uso,
console.log(keycloak)generará un objeto keycloak completo. Incluso si vuelvo a cargar, permanece allí en la consola.
Pero cuando uso,
console.log(keycloak.token)Emitirá un token del objeto keycloak, pero cuando vuelvo a cargar la página, me da indefinido en la consola.
Mi componente Vue:
<template> <div class="home"> {{ arrowFunction() }} </div> </template> <script lang="ts"> import { defineComponent } from "vue"; import { useKeycloak } from "@baloise/vue-keycloak"; export default defineComponent({ name: "Home", setup() { const { keycloak } = useKeycloak(); function arrowFunction() { console.log(keycloak); return keycloak; } return { arrowFunction, }; }, }); </script>Mis Main.ts:
import { vueKeycloak } from "@baloise/vue-keycloak"; import { createApp } from "vue"; import App from "./App.vue"; import router from "./router"; import store from "./store"; const app = createApp(App); app.use(vueKeycloak, { initOptions: { onLoad: "login-required", // default }, config: { url: "https://xxxxxxxxxxxxxx.com/auth/", realm: "xxxxx", clientId: "xxxxclient", }, }); createApp(App).use(store).use(router).mount("#app"); La información se almacena aquí: 
1 Respuestas
Responde la pregunta0
El LÉAME del paquete keycloak muestra que useKeycloak() expone algunos estados. Uno de ellos parece ser lo que querías obtener en primer lugar (token).
Entonces, sugiero que en lugar de solo obtener la propiedad keycloak e intentar obtener un token de eso, es posible que desee obtener el estado que está buscando directamente y, por lo tanto, volvería a escribir su código para
setup() { const { keycloak, token } = useKeycloak(); function arrowFunction() { console.log(keycloak); console.log(token); return keycloak; } return { arrowFunction, }; },Nunca trabajé con la biblioteca, así que dime cuando me falta algo importante, pero creo que esto debería funcionar como quieres.
Elaboración adicional:
Si echamos un vistazo a la documentación de useKeycloak(); podemos ver que devolverá un Objeto con varias Propiedades. Entre los que tenemos keycloak y token.
Obtenemos las propiedades de ese Objeto directamente al desestructurarlos en la llamada.
const { keycloak } = useKeycloak();será lo mismo que
const ReturnValue = useKeycloak(); const keycloak = ReturnValue.keycloak;Entonces, podemos vincular la propiedad expuesta deseada del valor de retorno al agregarla entre llaves, lo que da como resultado:
const { keycloak, token } = useKeycloak(); // Same as: // const ReturnValue = useKeycloak(); // const keycloak = ReturnValue.keycloak; // const token = ReturnValue.token; Entonces, lo que sucedió inicialmente fue que efectivamente estaba registrando console.log(useKeycloak().keycloak.token);