To store multiple values of form using AsyncStorage - react-native

Question

I need to store two values from a screen using AsyncStorage and also store it in the format of key value pairs.I want this data to be stored locally in the mobile and later retrieved from it when needed.
I have tried to retrieve single data but haven't been able to do with multiple data.
import React, { Component } from 'react';
import { StyleSheet, AsyncStorage, TextInput, View, Alert, Button, Text, TouchableOpacity } from 'react-native';
class FormData extends Component {
constructor(props){
super(props)
this.state = {
// myKey: '',
key: '',
text1: '',
text2: '',
getValue: '',
infoValue:''
};
}
savefunction = () => {
let storedObject = {};
storedObject.textval1 = text1;
storedObject.textval2 = text2;
try {
AsyncStorage.setItem('allTextValue', JSON.stringify(storedObject));
} catch (error) {
}
}
getfunction = () => {
try {
AsyncStorage.getItem('allTextValue').then((infoValue) => {
let resObject = JSON.parse(infoValue);
let textval1 = resObject.text1
let textval2 = resObject.text2
}).done();
} catch (error) {
}
}
render (){
return(
<View style={styles.MainContainer}>
<Text style= {styles.TextComponentStyle}>User Form</Text>
<TextInput
placeholder="Enter User Email"
onChangeText={(value) => this.setState({ text1: value})}
underlineColorAndroid='transparent'
style={styles.TextInputStyleClass}
/>
<TextInput
placeholder="Enter User Password"
onChangeText={(value) => this.setState({ text2: value})}
underlineColorAndroid='transparent'
style={styles.TextInputStyleClass}
/>
<Button onPress={this.savefunction}
title="Save key" color="#2196F3" />
<Button onPress={this.getfunction}
title="Get key" color="#2196F3" />
<Text style={styles.text}> {this.state.getValue} </Text>
</View>
);
}
}
export default FormData;
const styles = StyleSheet.create({
MainContainer :{
justifyContent: 'center',
flex:1,
margin: 10,
},
TextInputStyleClass: {
textAlign: 'center',
marginBottom: 7,
height: 40,
borderWidth: 1,
// Set border Hex Color Code Here.
borderColor: '#2196F3',
// Set border Radius.
borderRadius: 5 ,
},
text: {
fontSize: 20,
textAlign: 'center',
},
TextComponentStyle: {
fontSize: 20,
color: "#000",
textAlign: 'center',
marginBottom: 15
}
});
I expect multiple data to be stored in the map with key value pair

Answer 1

You're not saving the price properly. You declare a status value and are putting a value into a variable with the same name. Code needs to be modified.
savefunction = () => {
let storedObject = {};
storedObject.textval1 = this.state.text1;
storedObject.textval2 = this.state.text2;
try {
AsyncStorage.setItem('allTextValue', JSON.stringify(storedObject));
} catch (error) {
}
}
...
getfunction = async () => {
try {
const infoValue = await AsyncStorage.getItem('allTextValue')
let resObject = JSON.parse(infoValue);
let textval1 = resObject.textval1
let textval2 = resObject.textval2
console.log(textval1);
console.log(textval2);
} catch (error) {
console.log(error);
}
}

Answer 2

The only part i see a problem is where you get the values from the object when you get the items:
let resObject = JSON.parse(infoValue);
let textval1 = resObject.textval1
let textval2 = resObject.textval1
You can also change it to
let resObject = JSON.parse(infoValue);
let {textval1, textval2} = resObject