firebase-ui 如何覆盖标题

Question

要登录我的 React 应用程序，我正在使用 firebase 和 firebaseui。

<StyledFirebaseAuth uiConfig={uiConfig} firebaseAuth={firebase.auth()} />

不幸的是，我无法覆盖标题（使用电子邮件登录）。有什么想法如何更改标题吗？

Answer 1

这已经晚了几年了，但是您可以通过以下方式解决此问题：在 uiShown 回调中，在 firebase auth UI 配置对象的回调部分中，您可以在 ui 时使用简单的查询选择器设置标题渲染

因此，在 JS 中，使用 firebase 文档中的示例配置：

var uiConfig = {
  callbacks: {
    signInSuccessWithAuthResult: function(authResult, redirectUrl) {
      // User successfully signed in.
      // Return type determines whether we continue the redirect automatically
      // or whether we leave that to developer to handle.
      return true;
    },
    uiShown: function() {
      // The widget is rendered.
      // CUSTOM TITLE CODE
      document.querySelector('.firebaseui-title').innerHTML = 'Your custom title';
      // Hide the loader.
      document.getElementById('loader').style.display = 'none';
    }
  },
  signInFlow: 'popup',
  signInSuccessUrl: '<url-to-redirect-to-on-success>',
  signInOptions: [
    firebase.auth.EmailAuthProvider.PROVIDER_ID,
  ],
  // Terms of service url.
  tosUrl: '<your-tos-url>',
  // Privacy policy url.
  privacyPolicyUrl: '<your-privacy-policy-url>'
};