Question

只需尝试验证登录表单的电子邮件ID和密码。

当我输入电子邮件和密码时，当我登录时，我收到验证失败的消息。

我是新手，对原生和火柴人做出反应。我不知道为什么它不起作用，怎么办。任何帮助都表示赞赏，并提前感谢。

这是我的login.js文件

import React, { Component } from 'react';
import {
  AppRegistry,
  Text,
  TextInput,
  View,
  StyleSheet, 
  Button,
} from 'react-native';
import Loader from './Loader';
import firebase from 'firebase';

export default class Login extends Component {

    state = {
        email: '',
        password: '',
        error: '',
        loading: false,
    };

    onButtonPress() {
        const { email, password } = this.state;
  this.setState({error: '', loading: true});


  firebase.auth().signInWithEmailAndPassword(email, password)
    .then(this.onAuthSuccess.bind(this))
    .catch(() => {
      firebase.auth().createUserWithEmailAndPassword(email, password)
        .then(this.onAuthSuccess.bind(this))
        .catch(this.onAuthFailed.bind(this));
    });
    }

onAuthSuccess() {
  this.setState({
  email: '',
  password: '',
  error: '',
  loading: false,
  })
}

onAuthFailed() {
  this.setState({
    error: 'Authentication Failed',
    loading: false,
  });
}

renderLoader() {
  if(this.state.loading) {
    return <Loader size="large" />;
  } else {
     return <Button onPress={this.onButtonPress.bind(this)} 
                title="Login">
              </Button>
  }
}

render() {
    return (
        <View style={styles.container}>
           <Text>Login</Text>

           <TextInput
              text={this.state.email}
              onTextChange={email => this.setState({ email })}
              textInputStyle={styles.fieldStyles}
              placeholder={'Email..'}
           />

            <TextInput
              text={this.state.password}
              onTextChange={password => this.setState({ password })}
              textInputStyle={styles.fieldStyles}
              placeholder={'Password..'}
              secureTextEntry
           />

           <Text style={styles.errorMessage}>
                {this.state.error}
           </Text>

          <View>
            {this.renderLoader()}
          </View>

        </View>
    );
}

和我的app.js文件

import React, { Component } from 'react';
import { View, Text } from 'react-native';
import firebase from 'firebase';
import Login from './Login';

class App extends Component {
   componentWillMount() {
      firebase.initializeApp({
        apiKey: 'xxxxxxx',
        authDomain: 'xxxxx.firebaseapp.com',
        databaseURL: 'https://xxxx.firebaseio.com',
        projectId: 'xxxx',
        storageBucket: 'xxxxx.appspot.com',
        messagingSenderId: 'xxxxxx'
    });
}
render() {
    return (
       <View>
            <Login />
        </View>
      );
    }
  }

This is the first sample login page

When i enter the credentials and click login following message shows up.

Answer 1

您需要在app.js文件中初始化Firebase 像这样

firebase.initializeApp（FirebaseConfig）;

现在您将可以在应用程序中访问Firebase

无法在native native和firebase中使用身份验证

1 个答案: