18.6 C
London
Saturday, September 7, 2024

android – How can I log in/join a person utilizing React Native?


I am making a React Native app which does not contain person interplay with different customers however requires the person to have an account with all of their data.

I’m presently simply assigning the person to a variable which a minimum of shops their info for me to make use of in different elements of the app, however I needed to discover a instrument that would retailer the entire customers and do issues like authenticate or log in correctly.

That is the code for the Log In part (I eliminated the kinds for higher understanding):

// Person info
const [user, setUser] = useState({
 identify: "",
 e mail: "",
 password: ""
});
const [name, setName] = useState("");
const [email, setEmail] = useState("");
const [password, SetPassword] = useState("");

// Capitalize person's identify
const capitalizeName = (identify) => {
 return identify
  .toLowerCase()
  .break up(' ')
  .map((phrase) => phrase.charAt(0).toUpperCase() + phrase.slice(1))
  .be a part of(' ');
};

// Deal with submit info
const handleSubmit = (identify, e mail, password, passwordAgain) => {
 if (!identify || !e mail || !password) {
  alert("All fiels are required");

 } else {
  setUser({
   identify: identify,
   e mail: e mail,
   password: password
  });
  return person;
 }
}

const Login = () => {
 return (
  <View>
   <Textual content>
    Log In to have the perfect expertise!
   </Textual content>
    
   <View>
    <TextInput identify="identify" worth={identify} placeholder={"Full Title"} autoCorrect={false} onSubmitEditing={(occasion) => setName(capitalizeName(occasion.nativeEvent.textual content))}/>
    <TextInput identify="e mail" worth={e mail} placeholder={"Electronic mail"} autoCorrect={false} onSubmitEditing={(occasion) => setEmail(occasion.nativeEvent.textual content.toLowerCase())}/>
    <TextInput identify="password" worth={password} placeholder={"New password"} autoCorrect={false} onSubmitEditing={(occasion) => setPassword(occasion.nativeEvent.textual content)}/>
    <TouchableOpacity model={} onPress={() => handleSubmit(identify, e mail, password, passwordAgain)}>Log in</TouchableOpacity>
   </View>
              
   <View>
    <Hyperlink href="/parts/frequent/ForgotPassword">
     Forgot Password?
    </Hyperlink>
   </View>

   <View>
    <Textual content>
     I am a brand new person.{" "}
    </Textual content>
    <Hyperlink href="/parts/frequent/ForgotPassword">
     Join
    </Hyperlink>
   </View>
  </View>
 )
}

Latest news
Related news

LEAVE A REPLY

Please enter your comment!
Please enter your name here