僅當用戶未登錄時才顯示登錄屏幕

Question

我正在嘗試制作一個本機應用程序。 我已經制作了登錄頁面，但我無法解決這個問題，我該如何制作一個標志來告訴我是否有用戶登錄。 如果用戶已登錄，請轉到儀表板。 否則登錄屏幕。

這是我的 App.js。

import React, { useState } from 'react';
import { StyleSheet, Text, View, Button, AsyncStorage } from 'react-native';

import Login from './components/Login';
import Dashboard from './components/Dashboard';

export default function App() {
  var [ token, setToken ] = useState('');

  function loginHandler(recievedToken) {
    setToken(recievedToken);
  }
  async function _readData() {
    try {
      const value = await AsyncStorage.getItem('Token');
      console.log(value);
      if (value !== null) {
        // We have data!!
        loginHandler(value)
      } else {
        loginHandler(null);
      }
    } catch (error) {
      // Error retrieving data
    }
  };
  return (
    <View>
      <Login />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

Answer 1

理想情況下，如果您正在開發一個完整的應用程序，您應該有一個身份驗證方法和一個服務器，用於驗證登錄和會話。 大多數方法使用具有到期日期並且不時更新的會話令牌。 這個令牌和這些方法都存儲在瀏覽器端本地。 一個例子應該是 OAuth 算法。

在此線程上，有些人討論了存儲令牌的方法：

如何在本機反應中存儲令牌？

編輯：我寫的這部分是關於 React 的，而不是 React Native，所以我把它留在下面：

您可以使用會話存儲來存儲該令牌或僅存儲簡化標志，如您所問。

我沒有資格談論為什么Session Storage vs Local Storage vs Cookies以及最佳實踐是什么，但這里有一些鏈接：

https://www.robinwieruch.de/local-storage-react

https://scotch.io/@PratyushB/local-storage-vs-session-storage-vs-cookie

https://oauth.net/2/

希望這足以讓你開始！