Questions tagged [usecallback]
251 questions
2
votes
2 answers
Dispatching actions inside inner functions of funtional component
I read that inner functions in statefull functional component should be defined using useCallback when we use setState or that function is passed as prop to child component. But what about dispatching actions? Do we need to use 'useCallback' there…
nikita kumari
- 41
- 4
2
votes
1 answer
Can't perform React state update on an unmounted component for useCallback
Sometimes I get an error and the full error message is:
"Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous…
zosozo
- 393
- 2
- 5
- 16
2
votes
2 answers
React best practice for changing state of parent component from child without rerendering all children?
I have a project where I'm displaying cards that contain attributes of a person in a textfield, and the user can edit the textfield to directly change that person's attribute values. However every time they're editing the textfield it causes a…
bizman2923
- 21
- 1
2
votes
1 answer
How to use DOMRect with useEffect in React?
I am trying to get the x and y of an element in React. I can do it just fine using DOMRect, but not in the first render. That's how my code is right now:
const Circle: React.FC = ({ children }: Props) => {
const context =…
Artur
- 21
- 3
2
votes
3 answers
React Native - How to submit a Formik from Header
I'm new to Formik and React Native. Currently, my goal is to submit a form via the Navigation header. All the examples I found are to submit the form from the screen page itself. I need help figure out how to properly use the handleSubmit and…
Yuze Sun
- 63
- 1
- 6
2
votes
1 answer
React Hooks useCallback dependency infinite loop
I'm currently fetching my data once when the component mounts, then whenever the user clicks a button. I want however to stop the button from fetching if a request is in progress, that's why I'm updating the isFetching state.
However, I need to add…
usersina
- 1,063
- 11
- 28
2
votes
1 answer
When to use useMemo and useCallback for performance optimization?
Consider i got such example:
import React, { useMemo, useCallback } from 'react'
const Hello = (props) => {
const { firstName, lastName } = props
const fullName = useMemo(() => `${firstName} ${lastName}`, [firstName, lastName])
const…
Limboer
- 373
- 4
- 24
2
votes
1 answer
React - update multiple useEffect / useCallback dependencies but only call effect once
I have a paginated list of data that I am updating based on a filter and an offset (page)
When the offset is updated (next/prev page) I hit the API and get new data. When the filter is updated I reset the offset to 0.
The problem is, when the filter…
Shawn Northrop
- 5,826
- 6
- 42
- 80
2
votes
0 answers
Need to wrap every useMemo dependency in a useCallback
I hope someone can help me. I tried to find the answer to my question but I couldn't, so if it is there and I couldn't find it, I apologize in advance.
So, I have an expensive operation that depends on 3 objects stored in the redux store. Since it…
DiegoTArg
- 452
- 1
- 4
- 14
2
votes
1 answer
Use custom hook inside a callback in React JS
I have this custom hook:
const useSomething = () => {
const displayAlert = (text) => {
alert(text);
};
return {displayAlert};
};
Now I want to use it somewhere in my code like following:
const SampleComponent = () => {
const…
Pejman
- 2,442
- 4
- 34
- 62
2
votes
0 answers
React hooks - adding exhaustive dependecies to useCallback/useEffect causes infinite loop
This has been answered here and here however I am still having the same problem after following the solution.
Building an app using react-beautiful-dnd. showMap is a boolean which gets passed from a parent component when a button is clicked. All…
asus
- 1,427
- 3
- 25
- 59
2
votes
1 answer
useCallback: When to use it? Is there any drawback / performance issue?
There are articles related to what is useCallback and to use it when necessary. But in a big project it's very difficult to understand when to start using this.
So, if I use it for every use case, will it hit the performance of the application.
pnkz
- 326
- 4
- 20
2
votes
1 answer
Avoid rerendering a list in React Hooks
I have a list of images that render on page load via a map function. I want to be able to select one or more images, and highlight them. Additionally, the selected images' titles will display at the top of the page. The issue I'm running in to is…
Farid
- 1,557
- 2
- 21
- 35
2
votes
1 answer
Reuse React.useCallback() function across multiple components
I have a few components that all call the same function on an onPress handler, let's say it looks like the following:
function MyComponent () {
const dispatch = useDispatch()
const updateThing = React.useCallback((thingId: string) => {
…
Alex
- 8,353
- 9
- 45
- 56
2
votes
2 answers
How to avoid unnecessary render in React using Hooks API
Please follow my code snippet below, When I click on any button (add, edit, remove) all my components gets re-render including the Title component which has no props or stats. It may be fine if I have a few components but lets assume that I have…
CasandraH
- 43
- 1
- 6