Как отключить кнопку отправки в пользовательском интерфейсе проверки подлинности по умолчанию?

#javascript #reactjs #aws-amplify #amplifyjs #aws-amplify-sdk-js

Вопрос:

Я хочу скрыть кнопку «Отправить» в пользовательском интерфейсе по умолчанию «Усилить», но не знаю, как этого добиться. Не наблюдал никакой документации в Amplify.

Вот мой код:

 function App() {
  return (
    <AmplifyAuthenticator>
        <AmplifyFormSection  slot="sign-in">
        <AmplifyOauthButton />
        </AmplifyFormSection>
        <div className="App">
        <Users></Users>
      </div>
    </AmplifyAuthenticator>
  );
}

 

Скриншот:

введите описание изображения здесь

Ответ №1:

Вы можете разместить его в AmplifyOauthButton качестве слота, как показано ниже:

 function App() {
  return (
    <AmplifyAuthenticator>
      <AmplifyOauthButton slot="sign-in" />
    </AmplifyAuthenticator>
  );
}
 

Комментарии:

1. Я попробовал это решение, однако мне нужно обернуть компонент приложения с помощью AmplifyAuthenticator, чтобы процесс аутентификации состоялся. Есть какие-нибудь предложения, как этого добиться ? Я обновил приведенный выше код с помощью компонента приложения, который необходимо аутентифицировать.

2. Вы пробовали использовать HOC withAuthenticator ?

3. Я использовал его раньше, но не нашел способа отредактировать форму входа, чтобы сохранить кнопку федеративного входа OAuth и удалить все остальное. Можете ли вы поделиться фрагментом кода, если у вас есть альтернативный способ сделать это ?

4. @RanopriyoNeogy Прошу прощения за чрезмерное упрощение ответа. Я отредактировал ответ правильным способом. Я проверил здесь и оказалось, что вы можете достичь этого, просто позвонив AmplifyOauthButton с помощью slot="sign-in"