我正在尝试在我的应用中创建用户，但一切正常。我有一些现有用户，使用它们没有任何问题，但是，新用户无法注册。
app.phyxable.com 通过注册可以在控制台中看到错误。
我曾尝试降级Firebase版本，但这也不起作用。
App.js
import SignInPage from "../../Pages/SignInPage/index.jsx";
import SignUpPage from "../../Pages/SignUpPage/index.jsx";
import DemoSignUpPage from "../../Pages/SignUpPage/DemoSignUpPage"
import DemoPageOneB from "../../Pages/DemoPages/DemoPageOneB"
import HomePage from "../../Pages/HomePage";
import DashboardSettingsPage from "../../Pages/DashboardSettingsPage"
import SubscriptionPage from "../../Pages/DashboardSettingsPage/SubscriptionPage"
import LandingPage from "../../Pages/LandingPage/";
import PhyxMenuPage from "../../Pages/PhyxMenuPage/";
import PhyxIntakePage from "../../Pages/PhyxIntakePage/";
import DemoRoutes from "./Routes/DemoRoutes";
import FourZeroFourPage from "../../Pages/FourZeroFourPage/index.jsx";
import { BrowserRouter as Router } from "react-router-dom";
import { Route, Switch } from "react-router-dom";
import * as routes from "../../Constants/routes";
import "./styles.css";
import { withAuthentication } from "../Auth/Session";
import { Elements, StripeProvider } from "react-stripe-elements";
import ForgotPassword from "../../Pages/ForgotPasswordPage/index.jsx";
import SubscribePage from "../../Pages/SubscribePage/index.jsx";
import PaymentSuccess from "../../Pages/PaymentSuccessPage/index.jsx";
import PhyxLevel from "../../Pages/PhyxLevel/index.jsx";
class App extends Component {
constructor(props) {
super(props);
this.state = {};
}
updateUserProfile = (key, value) => {
const uid = this.props.firebase.auth.currentUser.uid;
const oldProfile = this.state.userProfile;
oldProfile[key] = value;
this.setState({ userProfile: oldProfile });
this.props.firebase.writeData(`${uid}/userProfile/`, key, value);
};
updateAppState = (key, value) => {
this.setState({ [key]: value });
};
componentDidUpdate() {
if (
this.props.firebase.auth.currentUser &&
this.props.firebase.auth.currentUser.userProfile &&
!this.state.userProfile
) {
this.setState(
{
userProfile: this.props.firebase.auth.currentUser.userProfile
.userProfile
}
);
}
}
render() {
return (
<StripeProvider apiKey="pk_test_nuzEMRxJjxd4og2Qy0rJlQ8k">
<Router>
<div>
{/*Unauthenticated*/}
<Route
exact
path={routes.LANDING}
render={props => (
<LandingPage userProfile={this.state.userProfile} appState={this.state} />
)}
/>
<Route
exact
path={routes.SIGN_UP}
render={props => (<SignUpPage userProfile={this.state.userProfile} updateAppState={this.updateAppState} />)}
/>
<Route
exact
path={routes.SIGN_UP_AFTER_DEMO}
render={props => <DemoSignUpPage updateAppState={this.updateAppState} appState={this.state} />}
/>
<Route
exact
path={routes.DEMO_PAGE_ONE_B}
render= {props => <DemoPageOneB updateUserProfile = {this.updateUserProfile} /> }
/>
<Route
exact
path={routes.SIGN_IN}
render={props => (
<SignInPage updateUserProfile={this.updateUserProfile} />
)}
/>
<Elements>
<Route
exact
path={routes.SUBSCRIBE}
render={props => (
<SubscribePage
updateUserProfile={this.updateUserProfile}
userProfile={this.state.userProfile}
/>
)}
/>
</Elements>
<Route
exact
path={routes.PAYMENT_SUCCESS}
render={props => (
<PaymentSuccess updateUserProfile={this.updateUserProfile} />
)}
/>
<Route
exact
path={routes.FORGOT_PASSWORD}
render={props => <ForgotPassword />}
/>
<DemoRoutes currentState={this.state} />
{/* Authenticated */}
<Elements>
<Route
exact
path={routes.HOME}
render={props => (
<HomePage
updateUserProfile={this.updateUserProfile}
userProfile={this.state.userProfile}
/>
)}
/>
</Elements>
<Route
exact
path={routes.PHYXMENU}
render={props => (
<PhyxMenuPage
updateUserProfile={this.updateUserProfile}
userProfile={this.state.userProfile}
/>
)}
/>
<Route
exact
path={routes.PHYXLVL}
render={props => (
<PhyxLevel
updateUserProfile={this.updateUserProfile}
userProfile={this.state.userProfile}
/>
)}
/>
<Route
exact
path={routes.SUBSCRIPTION_PAGE}
render={props => (
<SubscriptionPage
updateUserProfile={this.updateUserProfile}
userProfile={this.state.userProfile}
/>
)}
/>
<Route
exact
path={routes.DASHBOARD_SETTINGS}
render={props => (
<DashboardSettingsPage
updateUserProfile={this.updateUserProfile}
userProfile={this.state.userProfile}
/>
)}
/>
<Route
exact
path={routes.PHYX}
render={props => (
<PhyxIntakePage
updateUserProfile={this.updateUserProfile}
userProfile={this.state.userProfile}
/>
)}
/>
{/* 404 */}
{/* <Route path="*" exact={true} component={FourZeroFourPage} /> */}
</div>
</Router>
</StripeProvider>
);
}
}
export default withAuthentication(App);
DemoRoutes.js
import { BrowserRouter as Router } from "react-router-dom";
import React, { Component } from "react";
import { Route, Switch } from "react-router-dom";
import * as routes from "../../../Constants/routes";
import DemoPageOne from "../../../Pages/DemoPages/DemoPageOne/index.jsx";
import DemoPageTwo from "../../../Pages/DemoPages/DemoPageTwo/index.jsx";
import DemoPageOneB from "../../../Pages/DemoPages/DemoPageOneB/index.jsx";
import DemoPageTwoB from "../../../Pages/DemoPages/DemoPageTwoB/index.jsx";
import DemoPageThree from "../../../Pages/DemoPages/DemoPageThree/index.jsx";
import DemoPageFour from "../../../Pages/DemoPages/DemoPageFour/index.jsx";
import DemoPageFive from "../../../Pages/DemoPages/DemoPageFive/index.jsx";
import DemoPageSix from "../../../Pages/DemoPages/DemoPageSix/index.jsx";
import DemoPageSeven from "../../../Pages/DemoPages/DemoPageSeven/index.jsx";
import DemoPageEight from "../../../Pages/DemoPages/DemoPageEight/index.jsx";
import DemoPageNine from "../../../Pages/DemoPages/DemoPageNine/index.jsx";
const DemoRoutes = ({currentState}) => {
console.log('demo routes', currentState)
return (
<>
<Route
exact
path={routes.DEMO_PAGE_ONE}
render={props => <DemoPageOne />}
/>
<Route
exact
path={routes.DEMO_PAGE_ONE_B}
render={props => <DemoPageOneB />}
/>
<Route
exact
path={routes.DEMO_PAGE_TWO_B}
render={props => <DemoPageTwoB />}
/>
<Route
exact
path={routes.DEMO_PAGE_TWO}
render={props => <DemoPageTwo />}
/>
<Route
exact
path={routes.DEMO_PAGE_THREE}
render={props => <DemoPageThree />}
/>
<Route
exact
path={routes.DEMO_PAGE_FOUR}
render={props => <DemoPageFour />}
/>
<Route
exact
path={routes.DEMO_PAGE_FIVE}
render={props => <DemoPageFive/>}
/>
<Route
exact
path={routes.DEMO_PAGE_SIX}
render={props => <DemoPageSix />}
/>
<Route
exact
path={routes.DEMO_PAGE_SEVEN}
render={props => <DemoPageSeven />}
/>
<Route
exact
path={routes.DEMO_PAGE_EIGHT}
render={props => <DemoPageEight currentState={currentState}/>}
/>
<Route
exact
path={routes.DEMO_PAGE_NINE}
render={props => <DemoPageNine />}
/>
</>
);
};
export default DemoRoutes;
这是错误
Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.
▶ 4 stack frames were collapsed.
App.componentDidUpdate
src/Components/App/index.js:49
46 | this.props.firebase.auth.currentUser.userProfile &&
47 | !this.state.userProfile
48 | ) {
> 49 | this.setState(
| ^ 50 | {
51 | userProfile: this.props.firebase.auth.currentUser.userProfile
52 | .userProfile
View compiled
▶ 16 stack frames were collapsed.
WithAuthentication._callee$
src/Components/Auth/Session/withAuthentication.js:34
31 | );
32 | const oldAuth = this.state.authUser;
33 | oldAuth.userProfile = { userProfile: userProfile };
> 34 | this.setState({ authUser: oldAuth });
| ^ 35 | }
36 |
37 | render() {
我在控制台中将Firebase中的这个对象打印了30次
demo routes ObjectuserProfile: null__proto__: Objectconstructor: ƒ Object()hasOwnProperty: ƒ hasOwnProperty()isPrototypeOf: ƒ isPrototypeOf()propertyIsEnumerable: ƒ propertyIsEnumerable()toLocaleString: ƒ toLocaleString()toString: ƒ toString()valueOf: ƒ valueOf()__defineGetter__: ƒ __defineGetter__()__defineSetter__: ƒ __defineSetter__()__lookupGetter__: ƒ __lookupGetter__()__lookupSetter__: ƒ __lookupSetter__()get __proto__: ƒ __proto__()set __proto__: ƒ __proto__()
应该转到下一页，但没有。