React Native，已成功设置状态，但想同时保存在asyncStorage中

Question

我有一个react native应用模块，用于跟踪健康统计信息。此示例是为了减轻重量，但是在仪表板加载时，会出现一个带有按钮以触发编辑器模式的空组件。这提供了一个textInput，用户可以在其中输入当天的重量，保存后将其保存为该数值的状态，并显示在仪表板上。

这完全符合预期，但我还希望将其与当前日期同时保存在asyncStorage中。如果当前日期与它的存储值匹配，但我希望整天保存，我想为这些值加载状态。

[基本上，如果用户在星期一醒来并记录其体重，我希望它整天显示在应用程序中，但是当他们在星期二打开它时，应该再次为空，以便用户输入当天的值，然后输入THAT值应该在星期二全天等，

为了实现该目标，我需要做什么？

import React, { Component } from 'react';
import { StyleSheet, Text,  View, Dimensions, Button, ScrollView, TouchableOpacity, TextInput, Alert} from 'react-native';
import { Pedometer } from "expo-sensors";
import {
  LineChart,
  BarChart,
  PieChart,
  ProgressChart,
  ContributionGraph,
  StackedBarChart
} from "react-native-chart-kit";
import PedometerChart from './PedometerChart';
import Icon from '@expo/vector-icons/Ionicons';
import MatIcon from '@expo/vector-icons/MaterialCommunityIcons';
import NumericInput from 'react-native-numeric-input';
import Modal from 'react-native-modal';
import moment from 'moment';



export default class Dashboard extends Component{

    state = {
    weight:'',
    currentDate: new Date(),
    markedDate: moment(new Date()).format("YYYY-MM-DD")
  };

  render() {

    const today = this.state.currentDate;
    const day = moment(today).format("dddd");
    const date = moment(today).format("MMMM D, YYYY");

    return(
      <ScrollView>
      <View style={styles.container}>

      <View style={styles.mainContainer}>
        <View style={styles.widgetContainer}>
            <MatIcon  name="scale-bathroom" size={50} />
            <Text style={styles.titleText}>Weight</Text>
        </View>
        <View style={styles.widgetContainer}>
            <Text>
              <Text style={styles.textUnderlines}>
              {this.state.weight}
              </Text>
              <Text style={styles.recordsTypes}>
              lb
              </Text>
            </Text>
            <TouchableOpacity 
                style={styles.recordButton} 
                onPress={this.toggleWeightModal}
            >
            <Text style={styles.recordText}>Record</Text>
            </TouchableOpacity>
        </View>
      </View>

      <Modal 
          isVisible={this.state.isWeightModalVisible}
          backdropOpacity={0.7}
          onBackdropPress={() => this.setState({ isWeightModalVisible: false })}
      >
        <View style={{ flex: 1 }}>
          <View style={styles.recordingModals}>
          <Text style={styles.titleText}>Weight for {date}</Text>
          <TextInput 
              value={this.state.weight}
              onChangeText={(weight) => this.setState({ weight })}
              keyboardType="numeric" 
              underlineColorAndroid="#000" 
              style={styles.modalInput} 
              placeholder="lbs"/>
          <TouchableOpacity style={styles.recordButtonModal} onPress={this.toggleWeightModal}>
          <Text style={styles.recordText}>Save Entry</Text>
          </TouchableOpacity>
          </View>
        </View>
      </Modal>
      </ScrollView>
    ) ;
  }
}

Answer 1

可以获取今天的日期并将其存储在变量中。如果日期不相同，则从状态（this.state.today）中比较该变量和日期（空容器）。

1. [重量容器更新后，请更新日期变量，这样就不会在同一天再次询问重量OR如果应用程序一直运行，请在每天的12夜重设重量容器，没有任何循环