title: Check username, password - Login Form using React Hooks
body: <p>I want to create a login form with array data UsersData.js:</p>
  <pre><code>const users = [
    {
      username: 'admin1',
      password: '12345678'
    },
    {
      username:'admin2',
      password:'012345678'
    }
  ];
  </code></pre>
  <p>and Login.js looks something like this:</p>
  <pre><code>import React, {useState} from 'react';
  import { users } from 'UsersData';
  
    function Login() {
        const [data, setData] = useState({
          username: '',
          password: ''
        });
            
        const {uname, pass} = data;
        const checkUser = () =&gt; {
          const usercheck = users.find(user =&gt; (user.username === uname &amp;&amp; user.password === pass));
          if(usercheck) {
            console.log(&quot;Login successful&quot;);
          }else {
            console.log(&quot;Wrong password or username&quot;);
          }
          // console.log(uname);
          console.log(usercheck);
        }
  
        const changeHandler = (e) =&gt; {
          setData({...data, [e.target.name]:[e.target.value]})
        }
        const handleSubmit = (e) =&gt; {
          e.preventDefault();
          checkUser();
          console.log(checkUser());
        }
  
      return (
        &lt;div className=&quot;login-bg&quot;&gt;
          &lt;div className=&quot;card&quot;&gt;
            &lt;form className='loginForm'
            onSubmit={handleSubmit}
            &gt;
            &lt;div className=&quot;input-text&quot;&gt;
                &lt;input
                  type=&quot;text&quot;
                  name=&quot;username&quot;
                  value={uname}
                  placeholder=&quot;Username&quot;
                  aria-describedby=&quot;inputGroupPrepend2&quot; required
                  onChange={changeHandler}
                /&gt;
            &lt;/div&gt;
            &lt;div className=&quot;input-text&quot;&gt;
              &lt;input
                type=&quot;password&quot;
                name=&quot;password&quot;
                value={pass}
                placeholder=&quot;Password&quot;
                aria-describedby=&quot;inputGroupPrepend2&quot; required
                onChange={changeHandler}
              /&gt;
              
            &lt;/div&gt;
            &lt;div className=&quot;buttons&quot;&gt;
                &lt;button type=&quot;submit&quot; className=&quot;btn btn-warning btn-block&quot;&gt;
                  Login
                &lt;/button&gt;
            &lt;/div&gt;
          &lt;/form&gt;
          &lt;/div&gt;
       &lt;/div&gt;
      )
    }
  export default Login;
  </code></pre>
  <p>So the above code only check whether the username and password fields entered in the form match the name and password of single record in the array of objects of UsersData.js the above code is working fine.I wrote checkUser() function but the result is not true.</p>
  <p>Please show an instance of how it is done. Sorry, I'm new to ReactJS so I'm a bit confused, hope you can help. Thanks</p>