firebase / firebase/firebaseui-web-react

Error: Uncaught (in promise) Error: AuthUI instance is deleted!

Đang mở
#59 29 bình luận 14 reaction 1 người được giao Được @jhuleatt nhận Xem trên GitHub
Ngôn ngữ chính
JavaScript
Star
1.3k
Fork
246
Chỉ số merge pull request
Không có pull request nào được merge trong 30 ngày

Mô tả

I'm using React-Router, with code like this:

```
// Import FirebaseAuth and firebase.
import React from "react";
import StyledFirebaseAuth from "react-firebaseui/StyledFirebaseAuth";
import firebase from "firebase";

// Configure Firebase.
const config = {
apiKey: process.env.REACT_APP_API_KEY,
authDomain: process.env.REACT_APP_AUTH_DOMAIN,
databaseURL: process.env.REACT_APP_DATABASE_URL,
projectId: process.env.REACT_APP_PROJECT_ID,
storageBucket: process.env.REACT_APP_STORAGE_BUCKET,
messagingSenderId: process.env.REACT_APP_MESSAGING_SENDER_ID
};

firebase.initializeApp(config);

// Configure FirebaseUI.
const uiConfig = {
// Popup signin flow rather than redirect flow.
signInFlow: "popup",
// Redirect to /signedIn after sign in is successful. Alternatively you can provide a callbacks.signInSuccess function.
signInSuccessUrl: "/signedIn",
signInOptions: [firebase.auth.GoogleAuthProvider.PROVIDER_ID]
};

export default class SignInScreen extends React.Component {
render() {
return (


My App


Please sign-in:




);
}
}
```
And here's my App.js

```
import React, { PureComponent } from "react";
import { withRouter } from "react-router";
import { Route, Switch } from "react-router-dom";
import NavigationDrawer from "react-md/lib/NavigationDrawers/NavigationDrawer";
// import { ListItem } from "react-md";
import { toTitle } from "./utils";

import { navItems, NavItemLinks } from "./pages/NavItems";
import Home from "./pages/home";
import Citations from "./pages/citations";
import Connect from "./pages/connect";

const styles = {
content: { minHeight: "auto" }
};

class RoutingExample extends PureComponent {
constructor(props) {
super();

this.state = { toolbarTitle: this.getCurrentTitle(props) };
}

componentWillReceiveProps(nextProps) {
this.setState({ toolbarTitle: this.getCurrentTitle(nextProps) });
}

getCurrentTitle = ({ location: { pathname } }) => {
const lastSection = pathname.substring(pathname.lastIndexOf("/") + 1);
if (lastSection === "") {
return "Home";
}

return toTitle(lastSection);
};

render() {
const { location } = this.props;
return (
}
contentStyle={styles.content}
drawerTitle={this.state.toolbarTitle}
contentClassName="md-grid"
>






);
}
}
export default withRouter(RoutingExample);
```

I won't explain all of the code, since it's irrelevant. The problem is that the 'Sign In with Google' button only shows up the first time I go to the '/connect' page. If I navigate again and go back, the Auth UI is gone, and when I look in the console I see: "Error: Uncaught (in promise) Error: AuthUI instance is deleted!"

My app also gets slower the more I navigate to and away from the 'connect' page, which makes me think that there might be a memory leak involved.

I have the same problem with the example on the front page using state.

I'd appreciate any help. Thanks!

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Đánh giá

Issue này chưa được đánh giá.

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.