Skip to content

Tag: reactjs

How to render each function component UI (synchronous)

I have two UI function component and i wanna render them synchronous, I mean when the first component render finished,it will be delete into DOM then the second component will be render after that. i used async await into hook but maybe i’m wrong. as you can see, i wanna render Loading component first then Home component will be render

why does setState runs once inside the map?

I have an array of objects which I want to map it and set the objects into the messagesList state, but only the last object is set. Actually, I want the setting to be done as soon as the map is executed but here it is done only once and the last item of the array is set. You can

How to stop ReactJS countdown timer from re-rendering?

I’m currently using a simple Countdown Timer component. This is the code of the component: My issue is that everytime I refresh my page, the timer starts again. I understand this has something to do with react re-rendering the components and I need to move this to a higher level to save state, but I’m not sure exactly how to

Date.getTime() in Next.js returns weird numbers

I am trying to make a page transition in Next.js. As the transition is slower than the page load, I need to calculate the missing time for the animation to finish. The transition should last at least 2 seconds, 1s for a fade in of the loading screen, 500ms so that the loading screen stays a little, and 500ms for

Paging in react

good morning, how are you? I’m having a problem with pagination, when I click to change the page it appears the page results and goes back to the first one right away, would you know how to help me? For example, if I click on page 2, its results appear but it immediately goes back to page 1, I don’t

Get Min date and Max date from Object

How can I find out the min and the max date from an object? Currently, I am getting an array like this: min date should be ‘2010-02-24’ and max date should be ‘2022-10-04’. Is there any built-in function to do this? Thanks in advance. Answer A sort will do the job here, by packing all dates into an array first:

React’s useRef hook doesn’t take a function?

I’m used to passing functions to useState, so that i don’t create unnecessary objects: I expected that useRef would work the same way, but the below returns a function instead of calling it once to intialize, then returning the prev created object after that. I suppose one could do something like this, but seems a lot less clean. Am I