


So ermitteln Sie, ob der Benutzer angemeldet ist, und springen in der React-Navigation zur Anmeldeseite
In diesem Artikel wird hauptsächlich erläutert, wie React-Navigation feststellt, ob der Benutzer angemeldet ist und zur Anmeldeseite springt. Interessierte Freunde können darauf verweisen.
In diesem Artikel wird React-Navigation vorgestellt um festzustellen, ob der Benutzer angemeldet ist, und zur Anmeldeseite springen? Teilen Sie es mit allen und hinterlassen Sie eine Notiz für sich selbst. Die Details lauten wie folgt:
Erstellen Sie eine neue index.js
import React, {Component} from 'react'; import {AppRegistry, Text, View, Button,Image,StyleSheet,BackHandler,ToastAndroid} from 'react-native'; import { StackNavigator,TabNavigator,NavigationActions } from 'react-navigation'; //全局存储 import stroage from './StorageUtil'; import './Global' import IndexScreen from './Index' import MeScreen from './Me' import Login from './Login' //底部菜单栏设置 const MainScreenNavigator = TabNavigator({ IndexScreen: { screen: IndexScreen, navigationOptions: { tabBarLabel: '首页', headerLeft:null,//去除返回按钮 tabBarIcon: ({ tintColor }) => ( <Image source={require('./img/ic_image.png')} style={[styles.icon, {tintColor: tintColor}]} /> ), onNavigationStateChange:(()=> alert("首页")) // initialRouteName:'IndexScreen' }, }, MeScreen: { screen: MeScreen, navigationOptions: { tabBarLabel:'我的', tabBarIcon: ({ tintColor }) => ( <Image source={require('./img/ic_me.png')} style={[styles.icon, {tintColor: tintColor}]} /> ), // initialRouteName:'MeScreen' } } }, { // trueinitialRouteName:'MeScreen',//设置默认的页面组件 // initialRouteName:'MeScreen', lazy:true,//是否根据需要懒惰呈现标签,而不是提前,意思是在app打开的时候将底部标签栏全部加载,默认false,推荐为true // order: ['IndexScreen','FindScreen','ListNewScreen','MeScreen'], //order 来定义tab显示的顺序,数组形式 animationEnabled: false, // 切换页面时是否有动画效果 tabBarPosition: 'bottom', // 显示在底端,android 默认是显示在页面顶端的 swipeEnabled: false, // 是否可以左右滑动切换tab // backBehavior: 'none', // 按 back 键是否跳转到第一个Tab(首页), none 为不跳转 tabBarOptions: { activeTintColor: '#2196f3', // 文字和图片选中颜色 inactiveTintColor: '#999', // 文字和图片未选中颜色 showIcon: true, // android 默认不显示 icon, 需要设置为 true 才会显示 indicatorStyle: { height: 0 // 如TabBar下面显示有一条线,可以设高度为0后隐藏 }, style: { backgroundColor: '#fff', // TabBar 背景色 height: 60 }, labelStyle: { fontSize: 14, // 文字大小 marginTop:2 // lineHeight:44 }, } }); //跳转路由设置 const FirstApp = StackNavigator({ IndexScreen: { screen: MainScreenNavigator, // initialRouteName: 'IndexScreen' }, MeScreen: {screen: MeScreen}, Login:{screen: Login}, }, { initialRouteName: 'IndexScreen', // 默认显示界面 navigationOptions: { // 屏幕导航的默认选项, 也可以在组件内用 static navigationOptions 设置(会覆盖此处的设置) headerStyle:{elevation: 0,shadowOpacity: 0,height:48,backgroundColor:"#2196f3"}, headerTitleStyle:{color:'#fff',fontSize:16}, //alignSelf:'center' 文字居中 headerBackTitleStyle:{color:'#fff',fontSize:12}, // headerTintColor:{}, gesturesEnabled:true,//是否支持滑动返回收拾,iOS默认支持,安卓默认关闭 }, mode: 'card', // 页面切换模式, 左右是card(相当于iOS中的push效果), 上下是modal(相当于iOS中的modal效果) headerMode: 'screen', // 导航栏的显示模式, screen: 有渐变透明效果, float: 无透明效果, none: 隐藏导航栏 onTransitionStart: (Start)=>{console.log('导航栏切换开始');}, // 回调 onTransitionEnd: ()=>{ console.log('导航栏切换结束'); } // 回调 }); // const defaultGetStateForAction = FirstApp.router.getStateForAction; FirstApp.router.getStateForAction = (action, state) => { //页面是MeScreen并且 global.user.loginState = false || ''(未登录) if (action.routeName ==='MeScreen'&& !global.user.loginState) { this.routes = [ ...state.routes, {key: 'id-'+Date.now(), routeName: 'Login', params: { name: 'name1'}}, ]; return { ...state, routes, index: this.routes.length - 1, }; } return defaultGetStateForAction(action, state); }; export default class FirstAppDemo extends Component { render() { return ( <FirstApp /> ); } } AppRegistry.registerComponent('FirstApp', () => FirstAppDemo); const styles = StyleSheet.create({ icon: { width: 26, height: 26, }, });
Erstellen Sie einen globalen Speicher StorageUtil.js
import React, {Component} from 'react'; import {AsyncStorage} from 'react-native'; import Storage from 'react-native-storage'; var storage = new Storage({ // 最大容量,默认值1000条数据循环存储 size: 1000, // 存储引擎:对于RN使用AsyncStorage,对于web使用window.localStorage // 如果不指定则数据只会保存在内存中,重启后即丢失 storageBackend: AsyncStorage, // 数据过期时间,默认一整天(1000 * 3600 * 24 毫秒),设为null则永不过期 defaultExpires: 1000 * 3600 * 24, // 读写时在内存中缓存数据。默认启用。 enableCache: true, // 如果storage中没有相应数据,或数据已过期, // 则会调用相应的sync方法,无缝返回最新数据。 // sync方法的具体说明会在后文提到 // 你可以在构造函数这里就写好sync的方法 // 或是写到另一个文件里,这里require引入 // 或是在任何时候,直接对storage.sync进行赋值修改 //sync: require('./sync') // 这个sync文件是要你自己写的 }) // 最好在全局范围内创建一个(且只有一个)storage实例,方便直接调用 // 对于web // window.storage = storage; // 对于react native // global.storage = storage; // 这样,在此**之后**的任意位置即可以直接调用storage // 注意:全局变量一定是先声明,后使用 // 如果你在某处调用storage报错未定义 // 请检查global.storage = storage语句是否确实已经执行过了 //导出为全局变量 global.storage = storage; 新建一个全局变量组件Global.js,用户存储用户登录的信息 //用户登录数据 global.user = { loginState:'',//登录状态 userData:'',//用户数据 }; //刷新的时候重新获得用户数据 storage.load({ key: 'loginState', }).then(ret => { global.user.loginState = true; global.user.userData = ret; }).catch(err => { global.user.loginState = false; global.user.userData = ''; })
Anmeldekomponente Login.js
_login() {//登录函数 // debugger; ToastUtil.show("登录成功"); // 使用key来保存数据。这些数据一般是全局独有的,常常需要调用的。 // 除非你手动移除,这些数据会被永久保存,而且默认不会过期。 storage.save({ key: 'loginState', // 注意:请不要在key中使用_下划线符号! data: { userid: '1001', userName:'userName', token: 'token' }, // 如果不指定过期时间,则会使用defaultExpires参数 // 如果设为null,则永不过期 // 8个小时后过期 expires: 1000 * 3600 * 8 }); global.user.loginState = true;//设置登录状态 global.user.userData = { userid: '1001', userName:'userName', token: 'token'};//保存用户数据 setTimeout(()=>{ this.props.navigation.navigate('UserScreen')//跳转到用户页面 },2000) }
Das Obige habe ich für alle zusammengestellt. Ich hoffe, dass es in Zukunft für alle hilfreich sein wird.
Verwandte Artikel:
Detaillierte Interpretation der Navigationsnutzung von React-Navigation
Detaillierte Interpretation der Funktionsfunktion in Javascript (ausführliches Tutorial )
So implementieren Sie eine benutzerdefinierte Visualisierung mit AngularJS2 integriert in D3.js
So implementieren Sie sequentielles Laden und Ausführen von js-Methoden in Javascript
Das obige ist der detaillierte Inhalt vonSo ermitteln Sie, ob der Benutzer angemeldet ist, und springen in der React-Navigation zur Anmeldeseite. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Heiße KI -Werkzeuge

Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool
Ausziehbilder kostenlos

Clothoff.io
KI-Kleiderentferner

AI Hentai Generator
Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

Heiße Werkzeuge

Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6
Visuelle Webentwicklungstools

SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Heiße Themen



Wenn Sie sich auf Ihrem Computer beim Steam-Konto einer anderen Person anmelden und das Konto dieser anderen Person über eine Hintergrundsoftware verfügt, lädt Steam automatisch die Hintergrundbilder herunter, die für das Konto der anderen Person abonniert wurden, nachdem Sie zu Ihrem eigenen Konto zurückgewechselt haben Deaktivieren der Steam-Cloud-Synchronisierung. Was tun, wenn WallpaperEngine die Hintergrundbilder anderer Personen herunterlädt, nachdem Sie sich bei einem anderen Konto angemeldet haben? 1. Melden Sie sich bei Ihrem eigenen Steam-Konto an, suchen Sie in den Einstellungen nach der Cloud-Synchronisierung und deaktivieren Sie die Steam-Cloud-Synchronisierung. 2. Melden Sie sich bei dem Steam-Konto einer anderen Person an, bei dem Sie sich zuvor angemeldet haben, öffnen Sie den Wallpaper Creative Workshop, suchen Sie nach den Abonnementinhalten und kündigen Sie dann alle Abonnements. (Falls Sie das Hintergrundbild in Zukunft nicht mehr finden, können Sie es zunächst abholen und dann das Abonnement kündigen.) 3. Wechseln Sie zurück zu Ihrem eigenen Steam

Mit der rasanten Entwicklung der sozialen Medien ist Xiaohongshu für viele junge Menschen zu einer beliebten Plattform geworden, auf der sie ihr Leben teilen und neue Produkte entdecken können. Während der Nutzung können Benutzer manchmal auf Schwierigkeiten stoßen, sich bei früheren Konten anzumelden. In diesem Artikel wird ausführlich erläutert, wie das Problem der Anmeldung beim alten Konto auf Xiaohongshu gelöst werden kann und wie mit der Möglichkeit umgegangen werden kann, dass das ursprüngliche Konto nach dem Ändern der Bindung verloren geht. 1. Wie melde ich mich bei Xiaohongshus vorherigem Konto an? 1. Rufen Sie das Passwort ab und melden Sie sich an. Wenn Sie sich längere Zeit nicht bei Xiaohongshu anmelden, wird Ihr Konto möglicherweise vom System recycelt. Um die Zugriffsrechte wiederherzustellen, können Sie versuchen, sich erneut bei Ihrem Konto anzumelden, indem Sie Ihr Passwort abrufen. Die Bedienungsschritte sind wie folgt: (1) Öffnen Sie die Xiaohongshu-App oder die offizielle Website und klicken Sie auf die Schaltfläche „Anmelden“. (2) Wählen Sie „Passwort abrufen“. (3) Geben Sie die Mobiltelefonnummer ein, die Sie bei der Registrierung Ihres Kontos verwendet haben

Die Lösung für das Discuz-Hintergrund-Login-Problem wird aufgezeigt. Mit der rasanten Entwicklung des Internets ist die Website-Erstellung immer häufiger geworden, und Discuz wurde als häufig verwendetes Forum-Website-Erstellungssystem bevorzugt viele Webmaster. Gerade aufgrund seiner leistungsstarken Funktionen stoßen wir jedoch manchmal auf Probleme bei der Verwendung von Discuz, wie z. B. Probleme bei der Anmeldung im Hintergrund. Heute werden wir die Lösung für das Discuz-Hintergrund-Login-Problem enthüllen und konkrete Codebeispiele bereitstellen. Wir hoffen, den Bedürftigen zu helfen.

Kürzlich haben mich einige Freunde gefragt, wie man sich bei der Kuaishou-Computerversion anmeldet. Hier ist die Anmeldemethode für die Kuaishou-Computerversion. Schritt 1: Suchen Sie zunächst im Browser Ihres Computers nach der offiziellen Website von Kuaishou auf Baidu. Schritt 2: Wählen Sie das erste Element in der Suchergebnisliste aus. Schritt 3: Nachdem Sie die Hauptseite der offiziellen Website von Kuaishou aufgerufen haben, klicken Sie auf die Videooption. Schritt 4: Klicken Sie oben rechts auf den Benutzer-Avatar. Schritt 5: Klicken Sie auf den QR-Code, um sich im Popup-Anmeldemenü anzumelden. Schritt 6: Öffnen Sie dann Kuaishou auf Ihrem Telefon und klicken Sie auf das Symbol in der oberen linken Ecke. Schritt 7: Klicken Sie auf das QR-Code-Logo. Schritt 8: Nachdem Sie auf das Scan-Symbol in der oberen rechten Ecke der Benutzeroberfläche „Mein QR-Code“ geklickt haben, scannen Sie den QR-Code auf Ihrem Computer. Schritt 9: Melden Sie sich abschließend bei der Computerversion von Kuaishou an

Wie melde ich mich mit Quark bei zwei Geräten an? Quark Browser unterstützt die gleichzeitige Anmeldung bei zwei Geräten, aber die meisten Freunde wissen nicht, wie sie sich mit Quark Browser bei zwei Geräten anmelden können zu zwei Geräten. Interessierte Benutzer kommen vorbei und schauen sich die grafischen Tutorials an! Tutorial zur Quark Browser-Nutzung Quark, wie man sich bei zwei Geräten anmeldet 1. Öffnen Sie zunächst die Quark Browser-APP und klicken Sie auf der Hauptseite auf [Quark Network Disk] 2. Rufen Sie dann die Quark Network Disk-Benutzeroberfläche auf und wählen Sie die Dienstfunktion [Mein Backup]. 3. Wählen Sie abschließend [Gerät wechseln], um sich bei zwei neuen Geräten anzumelden.

Baidu Netdisk kann nicht nur verschiedene Softwareressourcen speichern, sondern diese auch mit anderen teilen. Es unterstützt die Multi-Terminal-Synchronisierung. Wenn auf Ihrem Computer kein Client heruntergeladen wurde, können Sie die Webversion aufrufen. Wie melde ich mich also bei der Baidu Netdisk-Webversion an? Werfen wir einen Blick auf die ausführliche Einführung. Anmeldeeingang für die Webversion von Baidu Netdisk: https://pan.baidu.com (Kopieren Sie den Link zum Öffnen in den Browser) Einführung in die Software 1. Teilen Bietet eine Dateifreigabefunktion, Benutzer können Dateien organisieren und sie mit bedürftigen Freunden teilen. 2. Cloud: Es beansprucht nicht zu viel Speicher. Die meisten Dateien werden in der Cloud gespeichert, wodurch effektiv Platz auf dem Computer gespart wird. 3. Fotoalbum: Unterstützt die Cloud-Fotoalbum-Funktion, importiert Fotos auf die Cloud-Festplatte und organisiert sie dann, damit jeder sie sehen kann.

Xiaohongshu ist mittlerweile in das tägliche Leben vieler Menschen integriert und erfreut die Benutzer mit seinen reichhaltigen Inhalten und praktischen Bedienmethoden. Manchmal vergessen wir das Kontopasswort. Es ist wirklich ärgerlich, sich nur an das Konto zu erinnern, sich aber nicht anmelden zu können. 1. Wie melde ich mich an, wenn Xiaohongshu sich nur an das Konto erinnert? Wenn wir unser Passwort vergessen, können wir uns über den Bestätigungscode auf unserem Mobiltelefon bei Xiaohongshu anmelden. Die spezifischen Vorgänge sind wie folgt: 1. Öffnen Sie die Xiaohongshu-App oder die Webversion von Xiaohongshu. 2. Klicken Sie auf die Schaltfläche „Anmelden“ und wählen Sie „Konto und Passwort anmelden“. 4. Klicken Sie auf die Schaltfläche „Passwort vergessen“. . Geben Sie Ihre Kontonummer ein. 5. Das System sendet einen Bestätigungscode an Ihr Mobiltelefon. Geben Sie den Bestätigungscode ein und klicken Sie auf „OK“. Sie können auch ein Drittanbieterkonto verwenden (z. B

115 Netdisk ist eine Netdisk, die viele Ressourcen speichern kann. Wie lautet also der Anmeldeeingang für die 115 Netdisk-Webversion? Benutzer müssen die URL https://115.com eingeben, um auf die Netdisk zuzugreifen, und können sie nach der Anmeldung verwenden . Diese 115 Netdisk-Webversions-Anmeldung mit der neuesten Zugangsfreigabe kann Ihnen erklären, wie Sie diese Funktion verwenden. Werfen Sie also einen Blick darauf. 115 Netdisk-Webversion, Anmeldeportal, Website-Freigabe: https://115.com Detaillierte Einführung: 1. Zuerst müssen Sie eine Möglichkeit auswählen, sich bei Netdisk anzumelden. 2. Sie können die hochgeladene Datei in der oberen rechten Ecke sehen. 3. Hier können Sie einen neuen Ordner erstellen und zwischen verschiedenen Modi wechseln. 4. Sie können der Datei verschiedene Tags hinzufügen. 5. Die privaten Nachrichten der Nutzer sind auf der Website einsehbar.
