使用useState

时间:2020-02-23 06:39:42

标签: react-native

反应本机形式。保持相同的格式React.useState并更新输入。反应是可能的。可以在本机反应吗?

 import React from "react";
import { View, StyleSheet } from "react-native";
import { Input, Text, Button } from "react-native-elements";
import Spacer from "../Spacer";
const RegisterScreen = () => {
  const [formData, setFormData] = React.useState({
    name: "",
    email: "",
    password: ""
  });
  const { name, email, password } = formData;

  const handleChange = name => e => {
    setFormData({ ...formData, [name]: e.target.value });
  };
  return (
    <View style={styles.container}>
      <Spacer>
        <Text h4 style={styles.header}>
          Register
        </Text>
      </Spacer>
      <Spacer>
        <Input
          label="Name"
          value={name}
          onChangeText={() => handleChange("name")}
        />
      </Spacer>
      <Spacer>
        <Input
          label="Email"
          value={email}
          onChangeText={() => handleChange("email")}
        />
      </Spacer>
      <Spacer>
        <Input
          label="Password"
          value={password}
          onChangeText={() => handleChange("password")}
        />
      </Spacer>
      <Spacer>
        <Button title="Sign Up" />
      </Spacer>
    </View>
  );
};
const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    marginBottom: 150
  },
  header: {
    textAlign: "center"
  }
});

export default RegisterScreen;

(React本机形式。保持相同的格式React.useState并更新输入。在react中可以做到这一点。可以在react native中完成吗?)

1 个答案:

答案 0 :(得分:0)

是的!它应该工作正常!只需导入useState,这是您的代码中缺少的。