Category "reactjs"

Custom React Hook typescript error on array return type

I've created a very simple custom hook: export function useI18n() : [ string, Dispatch<SetStateAction<string>> ] { const [ language, setLanguage

Cross Domain Cookie Golang ReactJs

In Go, I am setting the cookie for frontend: http.SetCookie(w, &http.Cookie{ Name: "jwt-token", Value: tokenString,

How to make React-Material UI data grid to render rows using alternate shades?

I am evaluating React-Material grid for my customer. One of the key feedback was the absence of alternate shading of rows, which impacts user experience. https:

React native web support

I have project in react native and it was build in iOS and android successfully. I have not used react native cli for that project. Now I have to give support f

How can i redirect after successful submit of form using react-redux

action.js import axios from 'axios'; import { EVENT_ADD_FAIL, EVENT_ADD_REQUEST, EVENT_ADD_SUCCESS } from '../constraints/eventConstraint'; const addEvent = (e

How do you get "x-" headers in Next.js

I am following an example from Sara Vieira's Opinionated Guide to React. In the example, she is doing something like this: export async function getServerSide

Centering Modal Title and button in React Bootstrap

I am trying to implement React Modal for my project. I want to center the Modal Title and Modal Button. I tried to use flex and just-content-center but it didn'

Can we pass setState as props from one component to other and change parent state from child component in React?

class App extends Component { constructor() { super(); this.state = { name: 'React' }; this.setState=this.setState.bind(this) } re

"Import in body of module; reorder to top import/first" Across Many Files

I have the same error as this answer, except instead of it just occurring in one file it is occurring in many; once I fix it for one file, another just pops up

Module not found: Error: Can't resolve 'react-dom/client'

I am using react with the following packages: { "name": "demo", "version": "0.1.0", "private": true, "dependencies": { "@testing-library/jest-dom":

Rollup preserveModulesRoot not working as expected

I feel like the preserveModulesRoot option while using preserveModules does not work as it should. Let's say I have a src/index.ts and a bunch of src/components

Setting homepage in package.json doesn't set PUBLIC_URL on build

Following the docs here (Building for Relative Paths), so setting homepage field in package.json doesn't set PUBLIC_URL during the build. Expected behavior %P

how to implement page navigation in react testing library (Link, a tag, history.push)

I am trying perform Dom testing at '/test' url page. my application use BrowseRouter from react-router-dom As following user approach, I want to manually chang

Invalid hooks call. Hooks can only be called inside of the body of a function component

Please have a look at the validate method inside the elfe-if condition in the below code. I am unable to call the useLocation method of react-router-dom. I have

Recharts: how is it possible to show only the value of ONE data point inside a Tooltip?

I am trying to implement the following example inside a Recharts LineChart: the Tooltip value is relative to the blue point, because my mouse happens to be near

useState and if statement causing Error: Too many re-renders. React limits the number of renders to prevent an infinite loop

What I'm attempting to create is a React component which conditionally renders when the value of the prop boxToggle is true, and also returns null when the user

Stripe parameter_invalid_integer

I am trying to setup PaymentIntents API from Stripe and the amount needed to be passed to the API is very confusing. Stripe Docs: All API requests expect amount

_reactDom2.default.render is not a function

consider the following react code the main.js file is: import React from 'react'; import ReactDOM from 'react-dom'; import Maincontainner from './maincontainn

tslint says calls to console.log are not allowed - How do I allow this?

I just started using create-react-app with typescript create-react-app my-app --scripts-version=react-scripts-ts and the default tslint.json configuration d

React scheduler's `unstable_runWithPriority` doesn't use `priority` in any way

I ran a profiler on the following code: function App() { const [ counter, setCounter ] = useState(0); return <div> <div>{counter}</div>