title: Filter products by the name entered from the input
body: <p>I made a filter by id. I'm trying to make a live filter by the first letters entered from the input, but it doesn't work.</p>
  <pre><code>const [foodList, setFoodList] = useState(DATA)
  const [input, setInput] = useState()
  
  const getInputValue = (event) =&gt; {
      setInput(event.target.value)
  }
  
  const liveFilter = () =&gt; {
      if (isNaN(input) !== false || input !== undefined) {
        // setFoodList(foodList.filter(e =&gt; (e.foodName).startsWith(input) === true)) // I tried to write like this but it doesn't work
        setFoodList(foodList.filter(el =&gt; el.id === parseInt(input)))
      } 
      if (input === '' || input === undefined) {
        setFoodList(DATA)
      }
      if (input &gt; foodList.length) {
        setFoodList(DATA)
      }
  }
  
  useEffect(liveFilter,[input]) 
  </code></pre>
  <p>Also I have a warning in useEffect:  &quot;React Hook useEffect has a missing dependency: 'foodList'. Either include it or remove the dependency array. You can also do a functional update 'setFoodList(f =&gt; ...)' if you only need 'foodList' in the 'setFoodList' call&quot;</p>
  <p>I don't understand how to fix it</p>