Category "reactjs"

Position labels in radial charts - react-vis

I am struggling with positioning labels in radial charts using the react-vis library. Here is my code: const DonutChart = () => { const data = [{ angle:

NextJS - Too Many Open Files Error in Production

I'm facing an issue in my Production environment during peak traffic hours. Any help on identifying the source of this error would be really appreciated. Error

Window.open() to trigger phone SMS/Call/Email app not working in Chrome on Android on Page Load - Using ReactJS

This is my code snippet. else if (item.title === 'Text') { try { window.open(`sms:${item.link}`,'_self') } catch

How can I aggregate/pivot this non-numeric data to show in a chart?

I'd like to show some data on a line chart. The source data looks like this: [ { date: 1, depth: 1, river: 'trent',

react-router-dom NavLink doesn't reflect isActive change without refreshing the page

I'm trying to use the NavLink's isActive prop to check whether the link's route is the current route to apply some visual styling. Whenever I navigate to a page

ESIDIR Error in NextJs, even if the code come from the official page

I need to learn Next.js for an interview, so I started to follow the tutorial published in Next.js official web page. It was all ok, until I arrived at this sec

react-bootstrap <Button> not working properly

So recently I decided to try and use the react-bootstrap library to make my code look simpler but for some reason the tag isn't working correctly. I have this

How to use if statement in export default function in react.js?

Can you explain how to use if statement inside a functional component? I am trying to define a constant based on the value of an event being passed into props.

Accessing and updating canvas node callback inside of useEffect - React

I've created a canvas which is set to a state using a callback. circles are then created based on mouse x and y that are then drawn to the canvas state after cl

React image multi crops

Hope you're doing fine :) I'm trying to set multiple crops with react-image-crop library, but it's getting really difficult to understand the logic behind it. I

Issue in implementing ChartJS in my new assignment of ReactJS App, please let me know where I am wrong

I want to upload a chart in my react app but when I use this Barchar.jsx component (have used js nothing changed) it is showing following errors in console(are

Problem in putting a download button to download a pdf file in a React Website

I'm creating a portfolio website using react and I want to add the feature of adding a download button in it so that anyone could download my resume through the

GraphQL - retrieves only maximum 10 items from Strapi

I am using React with Strapi and GrapqQL in order to retreive my data from Strapi. Seems that my query retrieves only maximum 10 items. The API is changed with

How to get all selected values of Tag Picker in Fluent UI

In the docs, some of the props do not exist on the component, so I guess it's outdated. I have a TagPicker component, I'm using the Tag Picker with inline sugge

React Click Counter: Updating State of just one element

This should be pretty simple, but I can't figure out how to do it. I have a component with multiple buttons, each with a "count" value, set with state. When a

Role based react-router

What is the best way to conditionally render routes in react-router based on user role. I have a case where not all roles have permission to view certain routes

Uncaught Error: Invalid hook call. ReactJs

I am relatively new to react and I am trying to render a leaflet map on my site but I am currently getting an Invalid Hook call error. Any information would be

Module not found: Error: Can't resolve '@mui/icons-material/SearchOutlined'

I have installed both the packages already the icon and the core but still m getting this error, why?? import React from 'react' import './Nav.css'; import

I want to add web3 package to react project - BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default

I add web3 package to my react project and start. yarn add web3 yarn start But it causes following errors: ... BREAKING CHANGE: webpack < 5 used to includ

React Native Metro bundler resolver issue with json (None of these files exist)

I have monorepo with React code and React Native code. react - common - - file.json ... react-native - App.js In App.js I tried to import json file from react/