Skip to content

debounce action integrated for input with React functional component.

Notifications You must be signed in to change notification settings

crazyobject/debounce-react-input

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

debounce effect integrate with the input element using functional component. You can refer the component created in file DebounceReactInput.js

Demo

Debounce React Input

Live demo

https://stackblitz.com/edit/react-debounce-input-functional

Usage

import { useState } from "react";
import DebounceReactInput from "./DebounceReactInput";
import "./app.css";

const sampleData = [
  {
    first: "Dhanesh",
    last: "Mane",
  }
];

function App() {
  const [userList, setUserList] = useState(sampleData);

  return (
    <div className="App">
      <DebounceReactInput userList={userList} setUserList={setUserList} />
      <div>
        <hr />
        {userList.map((user) => {
          return (
            <div>
              {user.first} {user.last}
            </div>
          );
        })}
      </div>
    </div>
  );
}

export default App;

About

debounce action integrated for input with React functional component.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published