React Concepts

Reset file upload in react

kartik goyal
1 min readAug 29, 2023

Input file is hard to reset automatically.
Once uploaded it can be reset using event object.
event.target.value = null
But the event object is attached to only the field.
Thus, making it difficult to access with other fields.

Ref link: https://bobbyhadz.com/blog/react-reset-file-input

React common component like header menu, rendering behaviour on navigation?

The react has ability to cache current page components. So when navigation is done in react it will render the component.
But will not re render thus any change in state while navigation on to another page will not picked up by react.
So using useEffect with empty dependency array will work definately?
No, still it will not pick the change written inside useEffect while navigation if we pass a empty dependency array.
Because it is rendering the same component which is cached and not watching state changes, as no change in dependency array thus on navigation no change will be visible.
So, always pass the dynamic paths in the dependency array to rerender the common components and do the desirable changes. Use useLocation hook in react-route-dom to do that.

--

--