DEV Community

loading...

Discussion on: πŸ…³πŸ†πŸ†ˆ-πŸ…ΎπŸ…½-πŸ†πŸ…΄πŸ…°πŸ…²πŸ†ƒ πŸŽ‰

Collapse
0916dhkim profile image
Donghyeon Kim • Edited

I usually rely on 3rd party libraries (either use them directly or write code heavily inspired by their implementation). One example would be react-hook-form package for your usecase 2.

react-hook-form equivalent of your code:

function App() {
  const { register, handleSubmit } = useForm();
  const onSubmit = (data) => console.log(data);

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <input {...register('email')} />
      <input {...register('password')} />
    </form>
  );
}
Enter fullscreen mode Exit fullscreen mode

Also, phone number formatting is not worth doing it DIY IMO. For example, your code is for 11-digit phone numbers, but Americans use 10-digit phone numbers. What about international numbers with + prefix? Obviously the list goes on, and it is really difficult to get it right.