reactjs Firebase登录按钮无响应,未创建新用户或错误

toiithl6  于 2022-12-18  发布在  React
关注(0)|答案(1)|浏览(99)

所以我对React Native和Windows上的模拟设备还是个新手,但我正在学习在线教程,并严格遵循了代码/说明,但由于某种原因,我没有得到任何响应Firebase或收到错误消息。我们正在建立一个基本的表单,并使用Firebase来登录和退出我们的应用程序。我们已经从以前的应用程序中创建了可重用的组件,包括登录按钮。不幸的是,我认为按钮没有响应或Firebase没有连接。我已经在www.example.com上上传了我的代码Github.com,下面是到存储库和我的代码的链接:
https://github.com/michalladon/authorization
下面是相应的代码片段:
登录表单组件:

import React, { Component } from 'react';
import { Text } from 'react-native';
import firebase from 'firebase';
import { Button, Card, CardSection, Input } from './common';

class LoginForm extends Component {
  state = { email: '', password: '', error: '' }

  onButtonPress() {
    const { email, password } = this.state;

    firebase.auth().signInWithEmailAndPassword(email, password)
      .catch(() => {
        firebase.auth().createUserWithEmailAndPassword(email, password)
        .catch(() => {
          this.setState({ error: 'Authentication Failed.' });
        });
      });
  }

  render() {
    return (
      <Card>
        <CardSection>
          <Input
            placeholder="user@gmail.com"
            label="Email"
            value={this.state.email}
            onChangeText={email => this.setState({ email })}
          />
        </CardSection>
        <CardSection>
          <Input
            secureTextEntry
            placeholder="password"
            label="Password"
            value={this.state.password}
            onChangeText={password => this.setState({ password })}
            style={{ height: 20, width: 100 }}
          />
        </CardSection>
        <Text style={styles.errorTextStyle}>
          {this.state.error}
        </Text>
        <CardSection>
          <Button onPress={this.onButtonPress.bind(this)}>
            Login
          </Button>
        </CardSection>
      </Card>
    );
  }
}

const styles = {
  errorTextStyle: {
    fontSize: 20,
    alignSelf: 'center',
    color: 'red'
  }
};

export default LoginForm;

可重复使用按钮组件:

import React from 'react';
import { Text, TouchableOpacity } from 'react-native';

const Button = ({ onPress, children }) => {
  const { buttonStyle, textStyle } = styles;

  return (
    <TouchableOpacity onPress={onPress} style={buttonStyle}>
      <Text style={textStyle}>
        {children}
      </Text>
    </TouchableOpacity>
  );
};

const styles = {
  textStyle: {
    alignSelf: 'center',
    color: '#007aff',
    fontSize: 16,
    fontWeight: '600',
    paddingTop: 10,
    paddingBottom: 10
  },
  buttonStyle: {
      flex: 1,
      alignSelf: 'stretch',
      backgroundColor: '#fff',
      borderRadius: 5,
      borderWidth: 1,
      borderColor: '#007aff',
      marginLeft: 5,
      marginRight: 5
  }
};

export { Button };

有人知道我的问题是什么吗?我在课堂上查过问题,也试过一些方法,但没有任何改变。Firebase没有新用户记录,我的应用程序通过Windows上的Android Studio在Nexus 5模拟器上运行也没有显示错误。任何帮助都将不胜感激。

jaql4c8m

jaql4c8m1#

要检查您的按钮响应,请执行以下操作- onPress={()=〉alert(“working...”)}。要检查您的firebase响应,请转到浏览器控制台的网络选项卡,然后单击您的按钮检查您的API。

相关问题