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: reactjs
Not getting IntelliSense in Visual Studio Code for React Native
I am trying to code a React Native application in Visual Studio Code. But I found that the hint for React Native for Styles element didn’t show when I code. I already installed: Here is the example when I type flex. It is supposed to show a list of styles element related to flex but it didn’t. Is anyone know…
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…
How can I make a reusable component for Material-UI Snackbar?
I have this Alert component to be used just to have a message that says “Successfully submitted” and I’m trying to use thin in a parent component. However, nothing shows in the parent component. AlertComponent Parent Component How can I fix this? Thank you. Answer Although @Ghader Salehi com…
How to iterate over all children elements?
How to iterate over all children elements? I have an array that has an infinite number of nested childrens, how do I output all of them? I only go through two levels, but there can be as many as you like. Answer Make the mapper a named function, and then you’ll be able to call it recursively.
Extend the timeout after each click on react
Suppose there’s the following simple component. When I click on the button, the message will change to Clicked for 1 second and then goes back to -. However, when I spam the button, I want the title to be Clicked but it should go back to – after the last click of the button. Basically, I want each…
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…
Link routes in react changes the link but nothing is changing in the content of the page
I’m trying to make a navbar using react , but although the link has changed , the content never being changed ! routes in my App.js : Home.js file , the content “Home” doesn’t appear , although the link changed: Also the content of Blog.js file doesn’t appear “same as Homel…
How to horizontally center the content of a div with css in React?
I have an HomeComponent as the following: In the Home.css file I have: As you can see in the following image the Home.css style is applied correctly but the content is not properly centered (the Play button is center aligned but the row is not) Answer Check out this answer from a similar question for more sug…