Skip to content

Instantly share code, notes, and snippets.

@simbathesailor
Last active January 8, 2020 12:34
Show Gist options
  • Save simbathesailor/709974316e8268b195fece9bc95a561c to your computer and use it in GitHub Desktop.
Save simbathesailor/709974316e8268b195fece9bc95a561c to your computer and use it in GitHub Desktop.
debounceuseeffectsnippet1.jsx
function ChildComponent({ value, setValue }) {
function makeApiCallRaw(value) {
console.log("make api call with value", value)
}
return (
<input
defaultValue={value}
value={value}
onChange={e => {
setValue(e.target.value); // Has to be non-debounced
makeApiCall(e.target.value) // has to be debounced
}}
/>
);
}
function App() {
const [value, setValue] = React.useState("");
return (
<div>
Hello World
<ChildComponent value={value} setValue={setValue} />
</div>
);
}
ReactDOM.render(<App />, document.getElementById("root"));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment