I have this code for a component: Feedback.tsx import React, { useState } from 'react'; import './Feedback.css'; import FeedbackButton from './FeedbackButton'; function Feedback() { const [isOpe...

I'm trying to build a custom hook that will handle loading and error behavior of an async call. I'd like to use it like so : const { loading, error} = useFetch(fetchUser, id) or const {loading...

I've been learning React and I read that the function returned from useEffect is meant to do cleanup and React performs the cleanup when the component unmounts. So I experimented with it a bit but...

I try to use hooks from an self developed package that uses useQuery within a create-react-app application. This is my scenario: I am developing two npm projects: 'Core' and 'Demo'. Core contains f...

For class components, this.setState calls batch if inside event handlers. But what happens if state is updated outside the event handler and using useState hook? function Component() { const [a, ...

I am using functional component and trying to achieve MVVM. I want to get updated value of redux state without using useSelector hook Here is my code model.js export class Model { getData = () =&g...

I'm very new to typescipt and trying to make a basic pin-input page. Sandbox link for my code . Although it is working, I'm getting this error for onChange function at line 10: Type 'Dispatch<S...

I'm currently working on a signup form and the following is a snippet of my code: const Signup = () => { const [username, setUsername] = useState('') const [email, setEmail] = useState('') c...

I have the following react component function ConferencingRoom() { const [participants, setParticipants] = useState({}) console.log('Participants -> ', participants) useEffect(() => { /...

I am trying to implement a search parameter functionality to my React image search app. And, I have learned that I need to (can) use the useSearchParams Hook, but I am not sure how to make these ch...

I'm new to React and those languages. Trying to apply a custom google font(Ubuntu) to whole project. I managed to pull the font into the project, but I can only use it in simple texts in App.js. Li...

I am trying to get the element by id. (It's an example code to reproduce the error) function MyComponent(){ const myId = useId(); useEffect(() => { const myComponentDOMElement = document.que...

I am trying to understand this (mostly very helpful) article which describe how to use react's context API to manage application-level state. For a simple application (in this case a basic counter ...

I want to have a state B that its value is dependent to sate A and when state A value updated, state B value updates subsequently. The problem is as @Atin Singh stated here changing multiple state...

i am getting the below error TypeError: Cannot read properties of undefined (reading 'name') in react data is not coming from the Products. i am learning the react now and this is my first project ...

I have a component that uses useContext and then its output is dependent on the value in the context. A simple example: import React, { useContext } from 'react'; const MyComponent = () => { ...

import { useContext, useEffect, useState } from 'react'; const Log = () => { useEffect(() => { console.log('Running ...') },[]) return(<p>here</p>) } export default ...

To create a site, I use nextjs, when creating pages, I took the general layout with the header and footer into a separate hoc component and wrapped the page components in the file with it _app.jsx:...

I'm trying to figure out the working of React Hook API. I'm trying to add a number to a list. The code that I commented, i.e myArray.push... doesn't seem to perform the operation, though the code b...

I'm new react typescript developer, here i have a code which works in 'js' 'but when changed to 'tsx' getting error: Type 'Element' is not assignable to type 'string'.ts(2322) it is pointing to 'he...

I want to trigger an asynchronous operation from an event handler on a component and after that operation completes, update some UI state in that component. But the component may be removed from th...

I want to test my custom hook but in React 18 @testing-library/react-hooks library is not working, instead I am using @testing-library/react it has renderHook function and it works fine, but this l...

the most secure way to save sensitive data such as token or payment information . should I store them in the android AsyncStorage, in the redux-store or shared preferences?

I'm using React hooks both to fetch GraphQL data with react-apollo and to store local state: const [userData, setUserData] = useState({}) const { loading, error, data } = useQuery(USER_QUERY) Ho...

I'm struggling to understand when and why exactly useReducer has advantages when compared to useState. There are many arguments out there but to me, none of them makes sense and in this post, I'm t...