Questions tagged [react-hooks]
React Hooks are a feature that allows developers to use state(s) and other React component lifecycle features without writing a class-based component.
react-hooks
30,903
questions
0
votes
0
answers
8
views
React doesn't renders its child components during batch state updates with child
React renders its child components when the parent renders. But if a render is triggered in both the components by a state change in the same batch then a render in parent component doesn't trigger a ...
- 13
0
votes
0
answers
7
views
Can not submit a NEXT.js form that changes some variables in a context file that is exported to another display page
I have 3 main files in my next.js Project. My settings are: no /src, yes App Router, yes Typescript, contains app/ folder. My main goal is to display some values that are updated through a form, in ...
0
votes
0
answers
10
views
Managing Multiple WebSocket Connections in React with Shared Connections for Components Using the Same URL
I'm working on a React application where I need to manage multiple WebSocket connections. Specifically, I want different components to be able to share a connection if they use the same URL. I'm using ...
-1
votes
0
answers
6
views
Fix ERROR: TypeError: Cannot read property 'useContext' of null, js engine: hermes & ERROR: Invariant Violation: "main" has not been registered
I'm using React Native to complete an app. The app was working fine on my android emulator up until I tried to add in react-native-svg and react-native-qrcode-svg from npmjs. After adding I was met ...
- 1
0
votes
0
answers
27
views
Can useReducer be used for state management instead of useState?
I have a set of product details stored in in Firestore. I've created a custom hook to fetch the product details. The product categories should be displayed in the matching url param. As I add more ...
- 13
0
votes
0
answers
10
views
How can I use mutationfn with a reusable API file
import axios from "axios";
const axiosInstance= axios.create({
baseURL:"https://jsonplaceholder.typicode.com"
})
class APIClient<T>{
endpoint:string
constructor(...
- 1
-1
votes
0
answers
9
views
React useGsap with scrolltrigger not updating actual width of the DOM element
/* eslint-disable @next/next/no-img-element */
"use client";
import { useLayoutEffect, useRef } from "react";
import { useGSAP } from "@gsap/react";
import { ...
0
votes
0
answers
9
views
Notifee Custom Sound works in foreground, not in background and kill mode in React Native
const queryClient = new QueryClient();
const Root = (props) => {
const { hasNotifPermission, requestNotifPermission } = useNotificationsPermission();
useEffect(() => {
LogBox....
- 1
0
votes
2
answers
74
views
useState hook not functioning properly
So I am creating a clone of Google Gemini using React js and I am keeping a useState hook to keep the track of the chat history in the format that gemini API requires (array of objects where each ...
0
votes
1
answer
61
views
Not able to get inside the for loop in React js
I am making a To-Do App. I am using React frontend, Node backend, and Postgresql DB.
I made a component called <TaskLists /> which takes three properties or props:
startDate
endDate
allTasks
...
- 23
0
votes
1
answer
33
views
Cannot update state from child element in React (functional components)
I want to have a child component reference and update a state; however, when I try to do so, it only works once or twice before breaking. Strangely, the parent element can still update the state.
...
-4
votes
0
answers
20
views
Invariant failed: A state mutation was detected between dispatches [closed]
This is the body of the code
const tableHeader = [
{ title: "Product name", widthClass: "w-[25%]" },
{ title: "Product category", widthClass: "w-[19%...
0
votes
0
answers
28
views
How to make a tooltip for a column in a table if the text in the column is larger than 250 pixels
I am using tailwind and shadcn for development.
My idea is that if the text in a column is larger than a certain number of pixels, it should be possible to see a tooltip from the shadcn library for ...
- 81
0
votes
1
answer
59
views
Change in locale is not affecting the application
I am creating an application with dayjs as the date-time library. In the application I am setting the default locale to "en" at the app level and when I am changing the language in the ...
- 171
0
votes
2
answers
39
views
Working of useSearchDebounce custom react hook
I found this code from this answer https://stackoverflow.com/a/68780417/26420821
How does it work?
export function useSearchDebounce(delay = 350) {
const [search, setSearch] = useState(null);
...
- 1