Как просмотреть сохраненные данные с помощью AsyncStorage? - PullRequest
Новая
       76

Как просмотреть сохраненные данные с помощью AsyncStorage?

0 голосов
/ 09 мая 2020

У меня есть код, который сохраняет и считывает значение состояния через AsyncStorage, однако при закрытии приложения или изменении экрана значение возвращается к исходному значению состояния, которое в моем случае равно нулю. Как изменить экран или закрыть приложение, чтобы значение оставалось последним измененным? Какая альтернатива переменным состояния?

Мой код: 

import React, { Component } from 'react'
import { Text, View, AsyncStorage, TextInput, StyleSheet, TouchableOpacity } from 'react-native'

export default class App extends Component {
  constructor(props){
    super(props);
    this.state = {
      txtInputData: '',
      getValue: '',
    }
  }

  saveValue = () => {
    if(this.state.txtInputData){
      AsyncStorage.setItem('key_default', this.state.txtInputData)
      this.setState({txtInputData: ''})
      alert('Data salved!')
    }else{
      alert('Please, fill the data!')
    }
  }

  getValue = () => {
    AsyncStorage.getItem('key_default').then(value => this.setState({getValue: value}))
  }


  render() {
    return (
      <View style={styles.mainContainer}> 
        <Text>Using AsyncStorage</Text>
        <TextInput
        style={styles.textInput}
        placeholder = 'type here'
        value = {this.state.txtInputData}
        onChangeText={data => this.setState({txtInputData: data})}
        />
        <TouchableOpacity
        onPress={this.saveValue}
        style={styles.TouchableOpacity}
        >
          <Text>Save value</Text>
        </TouchableOpacity>
        <TouchableOpacity
        onPress={this.getValue}
        style={styles.TouchableOpacity}
        >
          <Text> Read value</Text>
        </TouchableOpacity>  
        <Text>Value read:{this.state.getValue}</Text>
      </View>
    )
  }
}

const styles = StyleSheet.create({
  mainContainer: {
    flex: 1,
    padding: 20,
  },
  textInput: {
    marginTop: 10,
    borderWidth: 1,
    borderColor: '#fa19',
    fontSize: 15
  },
  TouchableOpacity: {
    width: '50%',
    marginTop: 10,
    borderWidth: 1,
    borderColor: '#fa19',
    padding: 10,
    alignSelf: 'center',
    alignItems: 'center'
  }
})

1 Ответ

0 голосов
/ 09 мая 2020

Просто установитеStat txtInputData вместо getValue, как это 

    getValue = () => {
    AsyncStorage.getItem('key_default').then(value => this.setState({txtInputData: value}))
  }
...