React Native + Firebae Email SignIn

使用 React Native + Firebase 製作 Email 登入模組

上一篇我們製作了註冊模組.這邊教你繼續製作登入模組

使用firebase.auth().signInWithEmailAndPassword(this.state.email, this.state.password)來呼叫


使用範例如下

import React, {Component} from 'react';
import {
  View,
  Text,
  TextInput,
  TouchableOpacity
} from 'react-native';
import css from '../css';
import * as firebase from 'firebase'
import Config from '../firebase';
export default class Signin extends Component {
  constructor(props) {
    super(props);
    this.state = {
      email: '',
      password: ''
    }
  }
  signin() {
    firebase.auth().signInWithEmailAndPassword(this.state.email, this.state.password).then(() => {
      alert('登入成功')
    }).catch((error) => {
      var errorCode = error.code;
      var errorMessage = error.message;
      alert('登入失敗' + errorCode + errorMessage)
    })
  }
  render() {
    return(
      <View style={css.container}>
       <View>
        <TextInput
         style={css.textinput}
         onChangeText={(text) => this.setState({email: text})}
         value={this.state.email}
         placeholder={"請輸入註冊信箱"}
        />
        <TextInput
         style={css.textinput}
         onChangeText={(text) => this.setState({password: text})}
         value={this.state.password}
         placeholder={"請輸入註冊密碼"}
        />
        <TouchableOpacity onPress={this.signin.bind(this)}>
         <Text>Enter</Text>
        </TouchableOpacity>
       </View>
      </View>
    )
  };
}


完成後.輸入已經註冊的帳號密碼..即可登入



留言

熱門文章