I have an question about when will the useLayoutEffect callback be triggered and when will the screen be drawn. Consider the following code: export default function CompA() { const [count, setCount] = useState(0); useLayoutEffect(() => { // I'll debug here…
Basically I want show less description and when I press "Read More" I wanna show the full description The code: import { useState } from "react"; const JobsListing = ({ job }) => { const [showFullDescription, setShowFullDescription] = useState(false); let…
I'm an experienced programmer (10+ years) but new to React (< 2 years). I picked up React in a very "operational" way (i.e. being happy when things work without very deep understanding of its inner workings). Now I'm trying to…
import { useEffect, useState } from 'react' export type TTOrigin = { name: 'Name1' | 'Name2' url: string } export function App() { const [data, setData] = useState<TTOrigin[]>([]) useEffect(() => { fetch('https://swapi.dev/api/people/1/') .then((res) => res.json()) .then((json) => setData(json)) .catch((err) =>…
We use hooks like useState() instead of vanilla variables to store some state because we want the UI to update correctly. But isn't that just a solution to the overcomplicated state created by React? Could we've gotten by updating the…
I have a problem with updating my object in array. const [list, setList] = useState([]); const changeRecordIndex = list.findIndex((recordItem) => recordItem.id === recordID); I creat new array, copy object wich i need and then change one parametr of object. It's…
I am trying to fetch some data inside my component using useEffect hook and it is going in infinite loop. I am using this react tutorial page and this race conditions page for reference. Here is my code. function AppNew…
I have use two state variables to the filter colors search, resultantColors. The existing useEffect watches the search from the input and then sets the filtered array. But these effects runs on every input changes, how can i possibly refactor…
I am implementing a typewriter effect in my React app where I fetch a string from a URL and display it one character at a time. I expect the effect to start from the first character (index 0) and proceed…
I have this custom hook that used to fetch multiple requests import dashboardApi from '@api/dashboardApi' import { queryKeys } from '@constants/queryKeys' import { TOP_PROJECT_SORT } from '@models/projectCost' import { UseQueryOptions, UseQueryResult, useQuery } from '@tanstack/react-query' import { NotifyService } from…