Category "reactjs"

type for useRef if used with setInterval, react-typescript

I am doing a simple animation in a next.js app. let flipInterval = useRef(); const startAnimation = () => { flipInterval.current = setInterval(() =>

Functions are not valid as a React child. This may happen if you return a Component instead of from render

I have written a Higher Order Component: import React from 'react'; const NewHOC = (PassedComponent) => { return class extends React.Component {

Can I use React Bootstrap with Next.js?

Does anyone know if you can use react-bootstrap with Next.js? I am using the latest versions of both, I can provide code at this point, but right now my app is

Only postive integers in input field in react

I have a input field for price and quantity and I want to restrict it to have only +ve integers. I don't want to do any kind of validation like the type=number

"React does not recognize the prop on a DOM element" in React Router

React does not recognize the computedMatch prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowerc

NextJS React Prerendering issue with Algolia connectSearchBox

I'm working with Algolia instant search for react, and I'm using a custom SearchBox component which I've written like so: import { connectSearchBox } from "reac

React executing code before the previous function call has finished

I'm trying to write a record to a database but need to find the next Id in the sequence. I wrote a function to find the highest Id number in the database, incr

How to handle Typescript Generics when using styled function from '@mui/material/styles'

import Table,{TableProps} from 'my/table/path' const StyledTable = styled(Table)({ ...my styles }) const AnotherTable = <T, H>(props: TableProps<T,

How to load firebase data before the component renders in react?

I have the following files... useAuthStatus.js import {useEffect, useState, useRef} from 'react'; import { getAuth, onAuthStateChanged } from 'firebase/auth';

TypeError: Cannot destructure property 'product' of 'productDetails' as it is undefined

**ProductDetailsScreen.js >>> Here is my code, I got the product list from Redux store, But facing a problem when initializing product details. ** e

textarea preview like stackoverflow have

I have a textarea, I created a preview div which only displays the text, but I want the text to have background color of grey when the sentence is between `` to

Uncaught TypeError: match is undefined leads to blank page

I'm currently doing a repo finder and I'm having an issue to make the program display the repo name The main page looks like this import {FaGithub, FaPlus, FaSp

Async arrow function expected no return value

I'm building an application with Firebase oAuth. I followed all the instructions, but my code is returning an error saying that 'asyn arrow function expected no

test case not working for callback setState function

I am calling two APIs using two different function. First, I am fetching order details using getOrder method. Once I get the order, I am calling another method

Error: Image Optimization using Next.js default loader is not compatible with `next export`

I got this error when deploying Next.js to Netlify. Error: Image Optimization using Next.js default loader is not compatible with `next export`. Possible solut

How to run nextjs dev server with the config from another project?

I develop a nextjs application. Inside the root folder, I've made landing/pages/ folder and I want to run dev server with those pages using next dev ./landing.

Cancelling Axios request in React when using React Router Switch

I'm a newbie building an App that utilizes React Router to switch between 3 different components that each utilize Axios to fetch data from an API. I am trying

React, Next.js and Type Script Unhandled Runtime Error TypeError: Cannot read properties of undefined (reading 'value')

I am developing a multi-page form using antd package to add some style In the main page of the form, I wrote the following code (I imported everything that I ne

material ui usestyles deprecated - do i need to change code

I'm a bit confused on material ui v5.5.2 on how to useStyles(). This website says deprecated but if so how do you still use this? https://mui.com/styles/basics

Custom react-admin drag & drop list

It can't drag. What is wrong with it? I'm using react-sortable-hoc with material-ui to custom react-admin list page with drag & drop sortable. Demo : https: