0

I have Amplify with Cognito signing in users on my Gridsome Vue app and working as expected, but I noticed that the "Sign Out" button will only show up if it is not wrapped in <amplify-authenticator> tags. Is the documentation just out-dated or is something broken?

Example, instead of:

<amplify-authenticator>
    <amplify-sign-out></amplify-sign-out>
</amplify-authenticator>

I am writing:

<amplify-sign-out></amplify-sign-out>

Which works.

This doesn't follow the docs but other than that it seems to be working as expected.

Here is how I am adding Amplify to my Gridsome project in main.js:

import Amplify, * as AmplifyModules from "aws-amplify"
import { AmplifyPlugin, components } from "aws-amplify-vue"
import aws_exports from "./aws-exports"
import "@aws-amplify/ui-vue"
Amplify.configure(aws_exports)

...

export default function(Vue, { router, head, isClient, appOptions }) {


    // Expose this.$Amplify in components
    Vue.use(AmplifyPlugin, AmplifyModules)
av0000
  • 1,917
  • 6
  • 31
  • 51

1 Answers1

0

When you successfully sign into the Authenticator component, you will then see the "Sign Out" button with the example you shared.

<amplify-authenticator>
    <amplify-sign-out></amplify-sign-out>
</amplify-authenticator>

Placing <amplify-sign-out></amplify-sign-out> button outside of the <amplify-authenticator> tags will make it so that "Sign Out" always appears.

anastasialanz
  • 46
  • 4