vasanthk / react-bits

✨ React patterns, techniques, tips and tricks ✨
https://vasanthk.gitbooks.io/react-bits
Creative Commons Attribution 4.0 International
16.97k stars 1.1k forks source link

List components #89

Open cytrowski opened 7 years ago

cytrowski commented 7 years ago

https://vasanthk.gitbooks.io/react-bits/patterns/32.list-components.html

I suggest putting that list item mapping function above SearchSuggestions component definition like below:

const renderSearchSuggestion = listItem => (
  <li key={listItem.id}>{listItem.name} {listItem.id}</li>
);

const SearchSuggestions = (props) => {
  return (
    <ul>
      {props.listItems.map(renderSearchSuggestion)}
    </ul>
  );
};

That way we do not create a new function each time SearchSuggestions rerenders.