Export variable from one file to another in react - reactjs

Question

I am currently working on a react-native based website and I am struggling to pass values from one file to another.
The value I am trying to import is 'Key':
class Encrypt extends Component {
encryptData = async() => {
fetch('http://localhost:7000/Data')
.then(res => res.json())
.then((data) => {
var pub1Key = data ;
var Key=pub1Key["encryptedData"];
}
And use it like this
class Decrypt extends Component {
deData(){
const requestOptions = {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({data: Key })
};
I tried to use export option but it didn't work.
These are two separate files. Encrypt.js and Decrypt.js.

Answer 1

You can manage this via any state manager. You can use Redux or Mobx or ReactContext for that.
However, if this is the token that is required for authentification or data that you want to access even after the page will be reloaded, you can simply store it in AsyncStorage.
So your code would look something like that.
import {AsyncStorage} from 'react-native';
class Encrypt extends Component {
encryptData = async() => {
fetch('http://localhost:7000/Data')
.then(res => res.json())
.then((data) => {
//you can decrypt 'data' here
return AsyncStorage.setItem('pub1Key', data);
})
.catch((err)=>{
//handle any errors here
})
}
class Decrypt extends Component {
async getData(){
return new Promise((resolve, reject)=> {
try{
const data = await AsyncStorage.setItem('pub1Key', data);
//you can encrypt data here
resolve(data);
} catch(e){
reject(e);
}
})
};
The docs for that.
https://reactnative.dev/docs/asyncstorage.html