按照文档,
退出登录需要
import { initAuthClient } from "@authing/vue-ui-components";
import { getAuthClient } from "@authing/vue-ui-components";
但我的:
initAuthClient undefined
getAuthClient undefined
登录是可以登录,请问使用Guard组件如何登出?
按照文档,
退出登录需要
import { initAuthClient } from "@authing/vue-ui-components";
import { getAuthClient } from "@authing/vue-ui-components";
但我的:
initAuthClient undefined
getAuthClient undefined
登录是可以登录,请问使用Guard组件如何登出?
{
"name": "demo",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"@authing/vue-ui-components": "^3.0.0",
"core-js": "^3.8.3",
"vue": "^3.2.13"
},
"devDependencies": {
"@babel/core": "^7.12.16",
"@babel/eslint-parser": "^7.12.16",
"@vue/cli-plugin-babel": "~5.0.0",
"@vue/cli-plugin-eslint": "~5.0.0",
"@vue/cli-service": "~5.0.0",
"eslint": "^7.32.0",
"eslint-plugin-vue": "^8.0.3"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/vue3-essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "@babel/eslint-parser"
},
"rules": {}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not dead",
"not ie 11"
]
}
您好,我们现在不推荐使用 getAuthClient 的方法,因为您使用的话必须是保证 Guard 组件已经正常初始化的情况下使用。现在我们推荐在 onLoad 与 onLogin 事件回调之中 得到 AuthClient。
感谢您的反馈我们也会及时的修改一下老文档的相关内容的。
OK,谢谢工程师的指导
我这边简单的写了一个 Demo 您按照这个思路去使用
<template>
<Guard :appId="appId" @load="onLoad" @login="onLogin"/>
<button v-if="guardAuthClient" @clink="onLogout">退出</button>
</template>
<script>
import { Guard } from "@authing/vue-ui-components";
import "@authing/vue-ui-components/lib/index.min.css";
export default {
components: {
Guard,
},
data() {
return {
appId: "AUTHING_APP_ID",
guardAuthClient: null
};
},
methods: {
onLoad: (authClient) => {
this.guardAuthClient = authClient
},
onLogin: (user, authClient) => {
this.guardAuthClient = authClient
},
onLogout: () => {
this.guardAuthClient.logout()
}
}
};
</script>
Nice,太感谢了