Is react 18 problem in this form validation?

in form validation, I use Handel change and the problem is it does not show in input value and state change with a single value, and at the last validation in submitting it does not show answer is it a problem for react 18 version... image: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>
    );
}

problem-solves if value-{data.[something]}