首页 > 解决方案 > firebase signinwithpopup() 在 onclick 中使用它时给我空白页

问题描述

当我尝试使用 google auth 登录 firebase 时,我的反应有问题

我使用这个语法来初始化 firebase

const configier = {
apiKey: "xxxxxxxcxxxxxxxxxxxx",
authDomain: "xxxxxxxxxxxxxxxxxxx",
databaseURL: "xxxxxxxxxxxxxxxxxxx",
projectId: "xxxxxxxxxxxxxx",
storageBucket: "xxxxxxxxxxx",
messagingSenderId: "xxxxxxxxxxxxx",
appId: "xxxxxxxxxxxxxxxxxx",
measurementId: "xxxxxxxxxx"


 };


  firebase.initializeApp(configier);
  

  export const firestore = firebase.firestore();
  export const auth = firebase.auth();
  
  const provider = new firebase.auth.GoogleAuthProvider();
  provider.setCustomParameters({ prompt: 'select_account' });
  export const signInWithGoogle = () => auth.signInWithPopup(provider);

然后当我尝试像这样放置 signInWithGoogle 时登录组件

<CustomButton onClick={signInWithGoogle} >sign In With Google</CustomButton>

我有空白页

空白页

我尝试使用signinwithredirect,但它也不起作用

但是当我在登录组件构造器中运行 signinwithpopup 时,它可以工作

当我在onclick里面添加()到signinwithpopup时也是这样的

<CustomButton onClick={signInWithGoogle()} >sign In With Google</CustomButton>

它可以工作,但是在页面加载时直接工作,当我按下登录按钮时我不想工作

我尝试在这样的匿名函数中使用它

onclick{()=> signInWithGoogle()}

但它也不起作用我尝试了所有解决方案但它不起作用

我希望任何人都可以帮助我

标签: javascriptreactjsfirebaseauthenticationfirebase-authentication

解决方案


通过在表单中​​的 onSubmit 中使用 event.preventDefault() 解决了该问题


推荐阅读