score:1
the reason for using usecallback
is to keep the same reference to a function between renders when needed.
usecallback
is supposed to accept callback function as an argument, as the name suggests. since usecallback(fn)
is a shortcut for usememo(() => fn)
, it technically can be (mis)used with any argument:
const getfetchurl = usecallback('https://hn.algolia.com/api/v1/search?query=' + query, [query]);
there are no benefits from doing this because usememo
and usecallback
are intended for lazy evaluation, while this results in eager evaluation.
the example with getfetchurl
callback isn't very illustrative because memoization doesn't provide any improvements, it could be simplified to:
function searchresults() {
const [query, setquery] = usestate('react');
const fetchurl = 'https://hn.algolia.com/api/v1/search?query=' + query;
useeffect(() => {
// ... fetch data and do something ...
}, [fetchurl]);
}
as for greeting
example, usecallback
is redundant. if the calculation is really expensive and needs to be lazily evaluated (in this example it isn't), this is what usememo
is for:
function greeting({ name }) {
const result = usememo(() => {
return `hello ${name}`;
}, [name]);
return <p>{result}</p>;
}
Source: stackoverflow.com
Related Query
- React Hooks: Is there a reason why leaving out the create or respectively the callback for useEffect and useCallback is bad?
- React Hooks : Why is it bad practice to pass the set state funcitons to a Child Component?
- Is there a reason people prefer using the constructor of a React component instead of componentWillMount?
- Why Call React Hooks at the Top Level?
- Why is the state not updating inside this react Hooks component?
- Why is there a semi-colon in the object structure for expected props in this typescript react component?
- Why is there a comma in the React import statement?
- Why do React hooks use a const in the React Docs?
- Is there cleaner way to define React Hooks useState on the top level?
- Why is there no `keyCode` value on the synthetic event in react using Semantic UI's Search component?
- Is there any way to define the datatype of value in state of hooks in functional component of react JS?
- Is there a reason I have to export React components as JSX or can I export them as objects that contain the JSX and other things?
- Is there a way to emulate the run frequency of constructor code using the React Hooks API?
- Why did react hooks changed the state value? without setState?
- Why is there a delay in my React budget app in calculating a total, updating state with setState and then rendering it to the UI?
- I'm using semantic ui react Card. I'm trying to create Memory game. is there a way i can have flip animation for the card.
- Variable created by const is not accessable before initialization in javaScript. But why there is no error in react create functional component
- Why does react keep changing into an unecessary timezone I just want to create a date object with the same date in the string
- Why is my state beeing updated before i call setState with React Hooks and how do i fix the disabled mouse pointer?
- Mocking out React.Suspense Whilst Leaving the Rest of React Intact
- React child component receives object. Why there is no visual update upon change of just one attribute of the object?
- What is the reason for useState() react hooks always returns the initial state?
- Why does React / NextJS still render the return if there is an IF to route?
- I am trying to dynamically create a Mui icon using React.createElement. However, React lowercases the element. Is there a way to keep case?
- Is there a way to create a button that allows me to increase the id value on slide.filter to be able to show the different contents of an array? REACT
- Why formData does not take the data there is in the state and that has been refreshed, there is a delay character ? React
- Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component when using Create React App and Formik
- Why is this object coming out with the key twice in React and Node.js?
- Is there any way in React Hooks we can changes the value of input tag on the click of onClick Function
- Why React Hooks doesn't update the data
More Query from same tag
- When giving unique keys to components, is it okay to use Math.random() for generating those keys?
- React: SVG dynamically add CSS by id or class
- How to make browserHistory work with webpack react
- Logical and pattern to hide/display components in React render function
- how can i get multiple values to display from a mapped api which has multiple images within the already looped array?
- Convert multiple es6 to multiple es5 file in order to create npm package
- How do I make all the contents of a Grid item stretch to the bottom, minus the typography?
- React Router: Update only one query parameter instead of replacing all
- How to add HTML elements in to JavaScript object and use in react
- How to map list of different svg components?
- Apollo local state - querying for object w unknown keys
- Using conditional timer interval in React componentDidMount() not working
- Jest renderIntoDocument not working
- Multiple and Multi selected Checkboxes in ReactJS
- Function reference in array
- JSON server - post data into specific object in array
- ReactJs how to hide load more option after all data fetch from database?
- Fetching single item vs fetching multiple items with Redux
- Function returning promise, instead of value
- Recharts Bar chart - conditionally show labels only on certain bars in stacked bar graph
- draft-js Cannot read property 'getIn' of undefined ( getUpdatedSelectionState )
- Why is the concept of immutability is embraced in React and its ecosystem?
- react bind onclick to function in export
- cannont send message through renderer process in electron
- Keycloak-js 'init()' not executing in React app
- how to add inline style width:calc(100% / var) in reactjs?
- Return a word from a words array when the time is the one from the time array. Javascript - React
- How to change the selected table row background color with React
- react doesn't render anything on my window
- React Router V4 Browser Back not working