Question

我是新来的本地人。我正在尝试在aync存储中保存两个不同的'TextInput'值。请建议我如何保存两个不同的“ TextInput”值，以及如何在“ Text”中获取这些值。

//AddScreen.js

import React, { Component } from 'react';
import { AppRegistry, AsyncStorage, View, Text, Button, TextInput, StyleSheet, Image, TouchableHighlight, Linking } from 'react-native';
import styles from '../components/styles';
import { createStackNavigator } from 'react-navigation';
import History from '../components/History';

export default class AddScreen extends Component {
    constructor(props) {
        super(props);
        this.state = {
            myKey: '',
           }
    }
    getKey = async () => {
        try {
            const value = await AsyncStorage.getItem('@MySuperStore:key');
            this.setState({ myKey: value });
        } catch (error) {
            console.log("Error retrieving data" + error);
        }
    }
    async saveKey(value) {
        try {
            await AsyncStorage.setItem('@MySuperStore:key', value);
        } catch (error) {
            console.log("Error saving data" + error);
        }
    }
    componentDidMount() {
        this.getKey();
    }
    render() {
        const { navigate } = this.props.navigation;
        return (
            <View style={styles.MainContainer}>

                <View style={styles.Date_input}>
                    <TextInput
                        placeholder="Date_input"
                        //multiline={true}
                        value={this.state.myKey}
                        onChangeText={(value) => this.saveKey(value)}
                    />
                </View>
                <View style={styles.CostType_input}>
                    <TextInput
                        placeholder="CostType_input"
                        value={this.state.mykey}
                        onChangeText={(value) => this.saveKey(value)}
                    />
                </View>
                <View style={styles.getKeytext}>
                    <Text >
                        Stored key is = {this.state.myKey}
                    </Text>
                    <Text >
                        Stored key is = {}
                    </Text>
                </View>
                <View style={styles.Historybutton}>
                    <Button
                        onPress={() => navigate('History', { key: this.state.myKey })}
                        title="Press Me"
                    />
                </View>
            </View>
        )
    }
}

我只想在尝试调用它们时获得两个不同的“ TextInput”值。请以我的榜样向我推荐。

Answer 1

您不应在每次状态更改（AsyncStorage）时致电onChangeText()。您可以做的是，将TextInput的值保存为两种状态，然后在按下按钮或其他操作时将其保存在AsyncStorage中。

例如：

constructor(props) {
  super(props);
  this.state = {
   myKey: '',
   text1: '',
   text2: ''
  }
}

 getKey = async () => {
        try {
            const key = await AsyncStorage.getItem('@MySuperStore:key');

            const key1 = await AsyncStorage.getItem('@MySuperStore:key1');
            const key2 = await AsyncStorage.getItem('@MySuperStore:key2');

            this.setState({ myKey: value });
        } catch (error) {
            console.log("Error retrieving data" + error);
        }
    }
 async saveKey(text1, text2) {
    //here you store two texts with two different key or concatenate text1 and text2 
    //store the both texts with one key. 

    key = text1+text2;
    try {
        await AsyncStorage.setItem('@MySuperStore:key1', text1);
        await AsyncStorage.setItem('@MySuperStore:key2', text2);

        // OR

        await AsyncStorage.setItem('@MySuperStore:key', key);
    } catch (error) {
        console.log("Error saving data" + error);
    }
}

 <TextInput
   placeholder="CostType_input"
   value={this.state.mykey}
   onChangeText={(value) => this.setState({ text1: value})}
  />
<TextInput
   placeholder="Some_input"
   value={this.state.mykey}
   onChangeText={(value) => this.setState({ text2: value})}
  />
 <Button
   onPress={() => this.saveKey(this.state.text1, this.state.text2)}
   title="Save key"
  />

您可以使用multiGet和multiSet来在AsyncStorage中检索和存储多个密钥。这是链接。 https://facebook.github.io/react-native/docs/asyncstorage#multiget

Answer 2

有两种方法可以将多个数据存储到异步中：

1）为两个值创建一个对象并存储到异步中：

设置值：

        let storedObject = {};
        storedObject.text1 = text1Value;
        storedObject.text2 = text2Value;

        try {
            AsyncStorage.setItem('allTextValue', JSON.stringify(userInfoTemp));
        } catch (error) {
        }

获得价值：

        try {
                AsyncStorage.getItem('allTextValue').then((infoValue) => {
                    let resObject = JSON.parse(infoValue)
                    let text1 = resObject.text1Value
                    let text2 = resObject.text2Value
                }).done();
            } catch (error) {
            }

2）设置单个单个值：

设置值：

      try {                            
            AsyncStorage.setItem('text1', text1Value);
            AsyncStorage.setItem('text2', text2Value);
      } catch (error) {
      }

获得价值：

   try {
        AsyncStorage.getItem('text1').then((text1Value) => {
            console.log(text1Value)
        }).done();
    } catch (error) {
    }
  try {
        AsyncStorage.getItem('text2').then((text2Value) => {
            console.log(text2Value)
        }).done();
    } catch (error) {
    }

在异步存储中保存多个值

2 个答案: