1
2
3

const [formParams, setFormParams] = React.useState({
  key: value,
});

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12

<form onSubmit={handleSubmit}>
	<TextField
	  onChange={(e) => onHandleChange(e, "key")}
	  label="field" //shown above text box
	  placeholder="Enter field" //shown in text box
	  type="key" //idek
	  fullWidth
	  required
	/>;
</form>

//remember to have button with type submit !

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

const onHandleChange = (e, field) => { //e = event
  switch (field) { //only change the changed value
    case "key1":
      setFormParams({ ...formParams, key1: e.target.value }); //keeps old value
      break;
    case "key2":
      setFormParams({ ...formParams, key2: e.target.value });
      break;
  }
};

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12

const handleSubmit = async (e) => {
    e.preventDefault(); //prevent page reload
    const request = await APIFirebase.signUp(
        formParams.key1, 
		formParams.key2
    ); //api call to store data into firebase
    if (!request) { //if no response
        console.log("Signup Failed!");
    } else { //request successful
        console.log("Signup Successful!");
    }
};