Skip to content

Adds ability to search for recipe & search for errors - #4

Open
katiedavis wants to merge 2 commits into
bridge-school:masterfrom
katiedavis:katie-davis
Open

Adds ability to search for recipe & search for errors#4
katiedavis wants to merge 2 commits into
bridge-school:masterfrom
katiedavis:katie-davis

Conversation

@katiedavis

Copy link
Copy Markdown

With literally no styling or tests...yet!

@timestep timestep left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome stuff!

Comment thread src/Components/Search.js
import React from "react";

export const Search = ({ onChange, value }) => {
return <input value={value} onChange={e => onChange(e)} />;

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Be careful here. When binding an input like this, anyone can pass any function here. Like an API call 😉. What happens is that when a user types, they can keep typing, and each type will fire an independent API call. This means for hello we have 5 API requests and they all return at different times because APIs take their own time to return.

One way to fix this problem is to use a function that keeps track, or holds on to the call for a certain amount of time, until either, the timer runs out, or the function is called again. This is traditionally called a debounce function. Its pretty normal to bind one to an input.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants