如何在React Native中使用访问令牌注销

Question

我正在尝试使用登录期间返回的访问令牌注销。

import React from 'react';
import { Text, Alert } from 'react-native';
import { Drawer,Container, Content, Header, Right, Button } from 'native-base';
import { FontAwesome } from '@expo/vector-icons'; 

export default class SideBar extends React.Component {
render() {
//console.log(this.props.usertoken);
return (
<Container>
<Header>
<Right>
<Button transparent>
<FontAwesome  name="close" size={24} color="#FFFFFF" onPress={() => this.props.closeDrawer()} />
</Button>   
</Right>
</Header>
<Content>

<Button transparent onPress={() => Alert.alert('Log Out Button pressed')}>
<Text style={{fontSize: 24}}>Log Out</Text>       
</Button>  
</Content>
</Container>
);
}
}

我已经通过"this.props.usertoken"…"在此页检索了访问令牌。有没有人可以帮助我如何通过将访问令牌绑定到注销按钮来注销。

Answer 1

使用上下文API创建全局状态或使用redux全局存储用户数据并访问用户数据(如令牌和其他东西)以处理它。

查看全局状态的更多信息:

• 上下文APIhttps://www.smashingmagazine.com/2020/01/introduction-react-context-api/

• 反应回来的https://react-redux.js.org/

使用异步存储或redux持久化存储数据到应用程序重启后访问的应用程序数据

• 异步存储https://react-native-async-storage.github.io/async-storage/docs/api/

• 回来的持续下去https://www.npmjs.com/package/redux-persist

Answer 2

如果你需要任何关于本地异步存储的帮助，你可以看看这段代码。

https://github.com/PiyushGaurav/devkraft-task

它基本上是一个有登录、注册和主屏幕的应用程序。您可以了解如何在登录、注册和注销功能中使用异步存储。另外，检查应用程序如何从本地存储检查当前登录的用户数据。