React Native，將身份驗證令牌傳遞給索引

我正在創建一個應用程序，其中導航組件位於索引中。在啓動時，您將自動進入登錄頁面。在此登錄頁面中，用戶將被授予身份驗證令牌。我怎樣才能讓這個令牌回到索引，以便它可以在應用程序的其餘部分使用？謝謝！React Native，將身份驗證令牌傳遞給索引

index.android.js

//lots of imports 
export default class CBURecCenterApp extends Component { 

constructor(){ 
    super() 
    this.renderScene = this.renderScene.bind(this) 
} 

renderScene(route, navigator){ 
    switch(route.name){ 
     case 'Home': 
      return <HomePage navigator={navigator} /> 
      break; 
     case 'Calendar': 
      return <CalendarPage navigator={navigator} /> 
      break; 
     case 'Events': 
      return <EventsPage navigator={navigator} /> 
      break; 
     case 'Discover': 
      return <DiscoverPage navigator={navigator} /> 
      break; 
     case 'Profile': 
      return <ProfilePage navigator={navigator} /> 
      break; 
     case 'Settings': 
      return <SettingsPage navigator={navigator} /> 
      break; 
     case 'Info': 
      return <InfoPage navigator={navigator} /> 
      break; 
     case 'Login': 
      return <LoginPage navigator={navigator} /> 
      break; 
     case 'Register': 
      return <RegisterPage navigator={navigator} /> 
      break; 
     default: 
      return <ErrorPage navigator={navigator} /> 
    } 
} 
render() { 
    return (
     <Navigator 
     initialRoute={{name: 'Login'}} 
     renderScene={this.renderScene} 
     /> 
    ); 
    } 
} 

AppRegistry.registerComponent('CBURecCenterApp',() => CBURecCenterApp);

LoginPage.js

import React, { Component, PropTypes } from 'react'; 
import { View, Text, TextInput, StyleSheet, TouchableHighlight} from 'react- native'; 
import Api from '../Utility/Api'; 


export default class LoginPage extends Component { 

constructor(props) { 
    super(props); 
    this.state = { 
     userName: null, 
     password: null 
     }; 
    } 

    navigate(name){ 
     this.props.navigator.push({ 
      name 
     }) 
    } 

    submitLogin(){ 
    response: Api.login(
     this.state.userName, 
     this.state.password 
    ); 
    if(response.status === 200){ 
     //pass authentication token to index.android.js 
     //navigate to home page 
    } 
    else{ 
     //invalid username/password handling code 
    } 
    } 

render(){ 
    return (
     <View> 
      <TextInput 
       style={styles.textField} 
       onChangeText={(userName) => this.setState({userName})} 
       value={this.state.userName} 
       keyboardType = {'email-address'} 
       autoCorrect = {false} 
       placeholder = {'CBU Email'} 
      /> 
      <TextInput 
       style={styles.textField} 
       onChangeText={(password) => this.setState({password})} 
       value={this.state.password} 
       keyboardType = {'email-address'} 
       autoCorrect = {false} 
       placeholder = {'password'} 
       secureTextEntry={ true } 
      /> 
     </View> 
    ) 
    } 
} 

const styles = StyleSheet.create({ 
textField: { 
    height: 40, 
    borderColor: 'gray', 
    borderWidth: 1 
} 
})

來源

2017-03-24 JerryVonJingles

使用本地存儲，檢查認證

this.props.login({ 
    email: this.state.email, 
    password: this.state.password 
}, function(err, token) { 
    if (err) console.log(err); 
    if(token) { 
     AsyncStorage.setItem("jwt", token, this._navToOffers); 

    } 
})

來源

2017-03-25 05:29:09

我一直在尋找一個簡單的道具傳遞到導航儀，我知道這可以通過簡單地通過道具來實現，當我推入導航堆棧時。

 navigate(name){ 
     this.props.navigator.push({ 
      name: name, 
      token: this.state.response 
     }) 
    }

來源

2017-03-25 18:01:02 JerryVonJingles

React Native，將身份驗證令牌傳遞給索引

回答

相關問題