Question

我在输入字段中键入一个问题，然后单击按钮设置AsyncStorage。但是实际上我通过这段代码得到的就是这样。

当我键入AsyncStore时，将设置项目，并且还将设置状态。如何使它不是在我键入时而是在我按下按钮时设置？

import React, { Component } from "react";
import { Text, View, TextInput, Button, StyleSheet } from "react-native";
import { AsyncStorage } from "react-native";
export class SetLocation extends Component {
  constructor() {
    super();
    this.state = {};
  }
  saveData = value => {
    AsyncStorage.setItem("myKey", value);
    this.setState({ myKey: value });
  };

  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.saved}>{this.state.myKey}</Text>
        <View>
          <TextInput
            style={styles.formInput}
            onChangeText={text => this.saveData(text)}
          />
          <Button
            title="Learn More"
            color="#841584"
            accessibilityLabel="Learn more about this purple button"
          />
        </View>
      </View>
    );
  }
}

var styles = StyleSheet.create({
  container: {
    padding: 30,
    flex: 1,
    justifyContent: "center",
    alignItems: "stretch",
    backgroundColor: "#F5FCFF"
  },
  formInput: {
    height: 26,
    fontSize: 13,
    borderWidth: 1,
    borderColor: "#555555"
  },
  saved: {
    fontSize: 20,
    textAlign: "center",
    margin: 10
  },
  instructions: {
    textAlign: "center",
    color: "#333333",
    marginBottom: 5,
    marginTop: 5
  }
});

export default SetLocation;

Answer 1

您应使用onSubmitEditing的{{1}}和onPress在Button中设置值

如docs

中所述

onSubmitEditing ：按下文本输入的“提交”按钮时调用的回调。如果指定了AsyncStorage，则无效。

multiline={true}

如何在React-Natvie中设置AsyncStorage onPress

1 个答案: