I want to use a state variable (value) when a modal is closed. However, any changes made to the state variable while the modal is open are not observed in the handler. I don't understand why it doe...

I've a formik form in a component that I'd want to reuse. In order to do that I need to listen to the form values changes in order to call two functions, getFormValues and getFormErrors, that will ...

In React I am using @react-three/fiber for the 3D stuff. There are a lot components that don't support declarative way of doing things and require refs and imperative code (e.g. CameraControls from...

I am building a chat app and would like to write integration tests using react-testing-library and can not figure out how to mock socket.io-client's socket.on, socket.emit, etc. I tried follow thi...

I am trying to make hover effect with react hooks I wrote function to hover based on some tutorials function useHover() { const [hovered, setHovered] = useState(false); const ref = useRef(nul...

In my React app, I have a custom defined hook that holds a useState value internally, but the custom hook itself does not return any values. If the value of its internal useState changes would this...

I am building a little local dev/testing/documentation environment for some components which are used across different projects and so want to create them as individual npm packages. Everything was...

In the code below, whenever I get new props from the parent, the new props are logged correctly on the console, but the rendered HTML is never updated after the initial render: export default funct...

I am facing some errors while rendering at SSR for some URL using renderToString from "react-dom/server" I am getting following error: TypeError: Cannot read property 'length' of undefine...

I'm used to passing functions to useState, so that i don't create unnecessary objects: useState(() => /* create complex obj */) I expected that useRef would work the same way, but the below ret...

How i can do memory cleaning by cat.destroy() method when component is dead? const object = useMemo(() => { return new Cat() }, [])

I have React function component that has a ref on one of its children. The ref is created via useRef. I want to test the component with the shallow renderer. I have to somehow mock the ref to tes...

I have a project using React in Strict Mode alongside GraphQL. I updated some packages, and I now get the following error in useEffect containing async calls. useEffect(() => { const loadTags ...

I honestly have no idea what is going on here. I have this code, on first render it should fetch popular repos and set them to the repos state, which should cause a re-render and paint the ne...

I am using react-select for better look on UI, and I have implemented it, Now what I am trying to do is I want to validate that input field when user clicks on Done button (form submit) I am using...

I'm trying to pass a ref from a parent component (an EditableCell) to a Child component (Input) and use its .current.focus property when the parent is clicked. I'm using the forwardRef function usi...

The app displays all photos <Photo> in a grid <PhotoGrid>, then once clicked, a function in <Photo> changes URL with history.push, and Router renders <Single> based on URL u...

While trying to install npm install, I am getting below error, how to resolve it? $ npm install npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! Whil...

On a react class I would write something like this class Myclass extends React.Component { handleUpdate = info => { //do the update } render() { return ( <SomeMarkup> <SomeComp...

I used react.js Hooks with useState and useEffect, when I scroll-down and the screen comes down Header hides after 250 pixels. Now I want to know how to display Header using the react Hooks when I ...

The standard way to use a React useState Hook is the following: const [count, setCount] = useState(0); However this const count variable is clearly going to be reassigned to a different primitiv...

My understanding is that Javascript classes store their methods on the Class prototype and therefore all Class instances use the same function definition in memory when invoking those methods. i.e....

Here I have code of react table using hooks, and i have struggled on task where I need to set all rows and subrows expanded by default when i open the page, I have tried several solutions, but all ...

Beginner here, but finding this quite tricky. So some help would be appreciated! I want to have users filter through some options. Those filters should be reflected in the URL. e.g. : http://localh...

I'm starting to use hooks in React and I got stuck, when I realized I would need an array of hooks to solve my problem. But according to the Rules of Hooks Only Call Hooks at the Top Level I'm no...