Category "reactjs"

How to dynamically validate a form with Yup?

I get an object with random properties (keys) and I would like to validate, this is an example of what I can get: { "underlying_ticker": "", "barrier":

How to call a smart contract function with WalletConnect? (React.js, Node.js)

Is it actually possible to call a smart contract function using WalletConnect? There is a documentation on official website that explains how to establish conne

React components not rendering on browser but not showing errors

index.js import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import App from './App'; import reportWebVitals from './reportWe

Error while using withStyles in mui version 5

I have problem in mui/material v5.0.4 and ts v4.4.4 while using withStyles method. I get this error for using AntSwitch component: 'AntSwitch' cannot be used as

How to stick the last column and add scrolling effect?

I want to stick last column and add scrolling effect in react mui table. I want last column to stick and previous 2 3 column will be scrollable. I have used mat

Roll up: typescript error (!) `this` has been rewritten to `undefined`

I am having issues with rollup this has been rewritten to undefined during rollup. Please someone should help me out on this. I found a hint online "you can u

How can I solve the css and JavaScript errors in React deploy?

jsx works well on the page. However, when there is a code like below, 'hello' cannot be printed on the console. useEffect(()=>{ console.log("hello"); },[])

How to get the specific attribute "folder_name" value from XML & store it in an array in React js?

class LoadXml extends React.Component { constructor() { super(); this.state = { total_page: null, menu_array: [] }; }

React MUI - form returns an variable that does not exist

Full code I have a part of the form that should be filled with data and be editable at the same time (it is the Update of the CRUD). The object is initialized w

How to test api is triggered or not in jest with testing react library

Login.js import {useSelector, useDispatch } from 'react-redux'; import Header from './Header'; import {submitForm, handleChange} from '../actions/authenticati

why my list have only two items , but it does 20 iterations -REACT

after iteration ,state.pokemons size is two, but the count print between 0 and 19 state = {pokemons:[],}; componentDidMount(){ let url = "https://pokeapi.co

My React JS frontend application freezes whenever I try to input a new value using Firebase

I am currently following a tutorial to make a simple frontend application that uses Firebase for authentication purposes. My code seemed to work when I only had

How to get localStorage, createContext, withrouter and history, component from react to work on client side while using NextJs?

I am trying to get the localStorage to work but I do not know how to load the code on just the client side. Also to just have certain files run with the informa

React Material UI v5 TypeScript extend component type

How to extend MUI component type with props and add extra props with minimum imported stuff? If possible without giving types to props, only to component itself

React-bootstrap Navbar Brand logo not rendering

I am trying to create a logo to use with the navbar on my react app using react bootstrap, and I have used the documentation as a guide. However, when viewing t

React onClick a links not working how do I make them work?

Im trying to create links in my homepage to my other pages that do not use Router. My links work in the app but when Ive transferred them to the homepage and th

GSAP scrolling breaks when switching browser tabs

I've noticed some strange behavior of GSAP scrolling in GatsbyJS. I have a container with full-page sections that are scrolled with GSAP. I open a tab in a brow

Does React Table Support Icons in Cells, and Collapsible Rows

Can React-Table support (Please refer to the image below) icon in table - in green rectangle ; collapse row when necessary - in red rectangle? If yes, may I kn

ReactJS - Serving the Same Build from Different Paths

I try to run the same react app on different URLs but for now without success. Description of the problem: I have a react app that works perfectly fine when run

Why does react/javascript recreates a function instance every time we call it?

For example, onChange function: const MyComponent = () => { const onChange = (e) => { doSomething(e.target.value) } return <input onChange={