I am trying to set timeout to API petition in case i get some error using get, then Loader keeps running for at least 3 seconds to finally show a text sayd “no data or API connection/petition failed”. I have Dashboard.jsx that works perfectly if theres not error for url, server API fallen, etc. To…
Tag: react-hooks
Custom use effect comparator : ReactJS
I am having a state variable that is defined as follows where done has the following structure I want to run the useffect when some changes are made to the done and also values array under each object. In my case, useEffect gets triggered when I remove/add an objects to the done. But not when some changes hap…
Why do I see stale data even after invalidating my queries?
I have created a function which adds a specific item to my diary. 9/10 times everything works, which means that there is nothing wrong with the code? However rarely I add the item to my diary, but I don’t see the update values, even thought I activated queryClient.invalidateQueries() method, the value i…
updating a useState to the value that it’s already holding inside of a custom React hook causes infinite re-render
The above will cause an infinite re-render. I had to solve by doing this: This is not the behavior inside of React components. Inside a component, if I set a useState to true when it is already true, then it will not cause re-render. Can someone confirm this behavior and explain why it causes infinite re-rend…
How to get value from one component to another page/component without navigation?
I have a navbar component in which there is an input search bar. Currently I am taking the value of the search bar and navigate to the Results component and access the input value useParams. I have the let [ result, setResult ] = useState([]); in my Results component because the results can change after the s…
useState is not re-rendering with push and pop on an array state
I’m attempting to update the usersData variable created using useState so that anytime someone clicks on add user, a data object is added to the beginning of usersData, but the problem is that it only works with spread operators and not with push, pop, or unshift operations, as seen in the code below. T…
Sending only the updated/newly created records to API in react hooks
I’m trying to get the updated/newly created records and send it to the backend in “queryparam” https://codesandbox.io/s/black-fire-ixeir?file=/src/App.js:3662-3701 In the above link, Step1 : when I add values for inputs “123” in input1 and “345” in input2.Then when I …
React text dropdown toggle (toggles all)
I am trying to make a small text dropdown. When you click on the heading text, the p tag will show. It is working, but.. it is toggling all of them, when I only click on of them. I have multiple “li” tags with text and the function. So I am not looping anything Answer Based on your question and
React, make a second API call based on a state set by a first api call
I am trying to build a weather app with OpenWeather API. I have to get the latitude and longitude based on a first API call that define the location by search. I have tried async/await and useEffect hook but failed in both cases. My code is below. What am I missing? Answer What you are missing is that when yo…
React Hook most proper ways to refactor resusable functions and effects
let’s consider two hook components: Despite being so similar, due to the nature of the context, we have to consider these hooks as different components, however, there is a lot of duplicated code to refactor and they even share the same code for some effects. Due to my experience with OOP, it is hard to…