How to set header-text in amplify-confirm-sign-up Vue component without removing default behaviour?

Viewed 269

I am configuring a custom message in the amplify-authenticator sign-up confirmation by using the supplied slot and passing a "header-text" to my <amplify-confirm-sign-up> as per the docs:

<amplify-authenticator username-alias="email">
  <amplify-confirm-sign-up slot="confirm-sign-up" username-alias="email" header-text="Custom Confirm Text"/>
</amplify-authenticator>

This works fine for the custom header-text, but it changes the default behaviour of the <amplify-confirm-sign-up> component. Specifically, when the user confirms the sign-up (in my case, supplies the one-time-confirmation code emailed):

  • it then no longer auto-populates the email address for the confirm-sign up
  • once user enters the code (thus confirming the sign-up) it doesn't log them in automatically.

I want to retain the above default workflow - what can I do to customise the header title and keep it?

0 Answers
Related