我想在
localstorage
中获得一些用户并在登录页面中使用它。
在下面的代码中,我只能在 localstorage 中保存一个用户,通过添加一个新用户,删除旧用户并替换新用户。
但是我希望添加每个新用户时不要删除旧用户,并且我想添加尽可能多的用户。
登录页面:
const Signin = () => {
const [values, setValue] = useState({ email: "", password: "" });
const navigate = useNavigate();
const onChangeInput = (name,e) => {
setValue(pvalue => ({
...pvalue,
[name]: e.target.value,
}));
};
const submit = () => {
let users = JSON.parse(localStorage.getItem("users") || "[]")
users.push({values})
localStorage.setItem('users', JSON.stringify(users))
}
function handleSubmit(e) {
e.preventDefault()
localStorage.setItem("user", JSON.stringify(values));
const loggeduser = JSON.parse(localStorage.getItem("user"));
if (
values.email === loggeduser.email &&
values.password === loggeduser.password
) {
alert("Emaill & Password is available!!!")
}
else{
navigate("/");
}
};
return (
<div className="text-center m-5-auto">
<form onSubmit={submit}>
<p>
<label>Email address:</label><br />
<input
name="email"
value={values.email}
onChange={(e)=>onChangeInput('email',e)}
/>
</p>
<p>
<label>Password:</label><br />
<input
name="password"
value={values.password}
onChange={(e)=>onChangeInput('password',e)}
/>
</p>
<p>
<button id="btn" type="submit" onClick={handleSubmit}>Register</button>
</p>
</form>
</div>
);
}
export default Signin;
我做了各种搜索,没有找到任何结果