Add and Live Search items with React Hooks
QUICK learning notebooks
Functions:
add items with add button
live search all items
two input tags for typing, an add button to submit, and the list showing all items
Add:
store data in arrays with useState(),
new item input held in with useRef()
add the input text when submitting the item.
the value is inputRef.current.value
, store the item value in the items array if not null, and empty the input after submitting
Search:
live search is working with onChange()
change the query array based on the value.
Show the filtered items according to the new array
useMemo()
to memorize the data for now and fasten the process. When the items or query change, run it.