Hooks

Added in React 16.8
Hooks let you use state and other React features without writing a class.


Different Hooks

useState - Returns a stateful value, and a function to update it.
useEffect - Accepts a function that contains imperative, possibly effectful code.
useContext - Accepts a context object (the value returned from React.createContext) and returns the current context value for that context.
useReducer
useCallback
useMemo
useRef
useImperativeHandle
useLayoutEffect
useDebugValue


useState

Returns a stateful value, and a function to update it.

const [state, setState] = useState(initialState); 

During the initial render, the returned state (state) is the same as the value passed as the first argument (initialState).
The setState function is used to update the state. It accepts a new state value and enqueues a re-render of the component.



useState - returns an array of 2 items.
We use destructuring to assign these to two variables



useEffect

Accepts a function that contains imperative, possibly effectful code.

useEffect(didUpdate); 


useContext

Accepts a context object (the value returned from React.createContext) and returns the current context value for that context.

const value = useContext(MyContext); 


@fluentui/react-hooks

Helpful hooks not provided by React itself.
These hooks were built for use in Fluent UI React





© 2022 Better Solutions Limited. All Rights Reserved. © 2022 Better Solutions Limited TopPrevNext