Currently I am mapping through a list in my react component: const items = useMemo(() => { return items.map(item => { const element = useSearchResult(item) }) ... }, [dependencies]) I am aware that calling a hook inside a useMemo is…
I am trying to create a custom toast to show error notification. Toast visibility is depends on the isShowed from the props. export type ToastProps = { color: 'error' | 'success' | 'warning'; message: string; isShowed: boolean; }; const Toast…
I'm trying to make reusable GET and POST requests, but I'm getting error Invalid hook call when setting the data state in the reusable fetch request component. I've just learnt that we can only use hooks in React components, so…
I have a functional component export const Example = () => { const [data, setData] = useState<number>(0); useEffect(() => { return () => { console.log("data", data); // ----> Here i want current value of data at the componentWillUnmount }; },…
I want to know how I can make my "page" variable in the below code dynamic, so I can properly compare it with the location.pathname variable which will have dynamic page ids. import { useLocation } from 'react-router-dom'; function AddToCart()…
I have this react App structure. Some components are hidden based on the content of a local storage. import React from "react"; import { BrowserRouter as Router } from "react-router-dom"; import AppRoutes from "./Routes"; import NavBar from "./components/NavBar"; const App…
I've read a ton of posts and articles, tried different approaches, inluding useContext, useReducer, etc. but i still can't understand why state does not change and why the page is not rerendering? const [access, setAccess] = useState(localStorage.getItem('access')); useEffect(() => {…
I want to fetch data based on a custom hook in react query. if (filter == "NEW") { const { data, isLoading } = useGetConsultasByStatusQueryDate({ status: "NEW", queryDate: allTimeDateQuery(), }); } but shows the next error: React Hook "useGetConsultasByStatusQueryDate" is…
I have a problem with state in react. I'm create state with base empty value. Then i'm using function which set state value and then take new state value (as i thought) into next function. But my state has old…
I have a list of refs that is being forwarded to the child components. They seem to work fine as I can do operations with them as feedback to the user actions (in this case, it is scrolling into view).…