是react 18问题在这个表单验证?

Question

在表单验证中，我使用Handel更改，问题是它不显示输入值和单个值的状态更改，并且在提交的最后一次验证中不显示答案这是react 18版本的问题吗?: https://drive.google.com/file/d/1s1uvHR7LrDOh1Ud2_hBzuFXum-MWYBHh/view?usp=sharing

import React, { useEffect, useState } from "react";
export default function App() {
const [data, setData] = useState({
name: "",
password: "",
});
function handlechange(e) {
let { name, value } = e.target;
return setData({ ...data, [name]: value }), console.log(data);
}
const onSubmithandeler = (e) => {
let names = data.name;
let passwords = !data.password.match(1);
if (!names) {
console.log("invalide name");
} else if (!passwords) {
console.log("password invalid");
} else if (!names || !passwords) {
console.log("all err");
} else {
setData(...data);
console.log(...data);
}
e.preventDefault();
};
return (
<div style={{ fontFamily: "roboto" }}>
<nav
className="font-lg w-full
text-white flex font-bold justify-start bg-blue-700 sticky"
>
<h3 className="m-1 p-2">Ecomerce</h3>
<h3 className="m-1 p-2">Login</h3>
<h4 className="m-1 p-2">Register</h4>
</nav>
<div className="bg-gray-300">
<div className="w-full h-screen flex items-center justify-center">
<form
onSubmit={onSubmithandeler}
className="w-full md:w-1/3 bg-white rounded-lg"
>
<div className="flex font-bold justify-center mt-6">
<img
className="h-20 w-20"
src="https://cdn.pixabay.com/photo/2018/11/13/21/43/avatar-3814049_960_720.png"
/>
</div>
<h2 className="text-3xl text-center text-gray-700 mb-4">
Login Form
</h2>
<div className="px-12 pb-10">
<div className="w-full mb-2">
<div className="flex items-center">
<input
type="text"
name="name"
value=""
onChange={handlechange}
placeholder="Username"
className="-mx-6 px-8  w-full border rounded px-3 py-2 text-gray-700 focus:outline-blue-400"
/>
</div>
</div>
<div className="w-full mb-2">
<div className="flex items-center">
<input
type="text"
placeholder="Password"
value=""
name="password"
onChange={handlechange}
className="-mx-6 px-8 w-full border rounded px-3 py-2 text-gray-700 focus:outline-blue-400"
/>
</div>
</div>
<div className="flex items-center ">
<input
type="checkbox"
className=" m-2 p-2 float-right focus:outline-blue-400"
/>
<a
href="#"
className="text-xs m-2 p-2 text-gray-500 float-right "
>
Forgot Password?
</a>
</div>
<button
type="submit"
value="Submit"
className="w-full py-2 rounded-full bg-green-600 text-gray-100  focus:outline-green-400"
>
Log In
</button>
</div>
</form>
</div>
</div>
</div>
);
}

Answer 1

如果value-{data.[something]}