What is the best way to trigger change or input event in react js

Question

With the help of code and example can u tell me What is the best way to trigger change or input event in react js?

Answer 1

To handle change or input events in React is by using the onChange event handler with React's useState to create a controlled component.

Implementation:

import React, { useState } from "react";

const InputComponent = () => {

  const [text, setText] = useState("");

  const handleChange = (event) => {

    setText(event.target.value); // Updating state with input value

  };

  return (

    <div>

      <input

        type="text"

        value={text} // Controlled component

        onChange={handleChange} // Triggers on input change

        placeholder="Type something..."

      />

      <p>Typed: {text}</p>

    </div>

  );

};

export default InputComponent;