How to create a custom “useInput” hook in React-Native

For my more recent React-Native projects I have been getting used to using hooks. Hooks are a fantastic feature of React/React-Native which enable us to use State in function components, in addition, they enable us to perform different functionality in our application depending on which hook we use such as useState, useRef, useEffect and useContext.

Furthermore, we can create our own hooks too which can be very useful if we are reusing a certain hook across many different components.

One of the most commonly used hooks is “useState” , State enables us to remember information about a certain part of a component and use it for other purposes i.e. we could have a piece of state to remember the text a user entered for an email address or we could have a piece of state that contains whether a value is true or false.

Throughout apps that I have made for my own personal use I have come across situations where I have had components that use the “useState” hook to remember information from a text box i.e. on a signup/signin form or on a modal. This means that I need to hold the value but also have a function that handles the text and sets the state when the user types something.

So instead of making a handle function for each text input that I use or just adding the setState function…