Questions tagged [reactjs]

React is a JavaScript library for building user interfaces. It uses a declarative, component-based paradigm and aims to be efficient and flexible.

Filter by
Sorted by
Tagged with
0 votes
0 answers
6 views

Need an adaptive table with horizontal scrolling in CSS

Нужно сделать адаптивную таблицу с закрепленной первой строкой(при вертикальном скролле) и первым столбцом(при горизонтальном) Ширина таблицы зависит от количества данных. Мне осталось решить одну ...
0 votes
1 answer
8 views

Unable to remove Entities from cesium-React in a loop

I am working on a cesium-react project to add common functionalities on the cesium-map using react. This is my Source Code. create bug download the code from link above and run the app and go to http:/...
0 votes
0 answers
8 views

Struggling to map through nested object.. React

Trying to map through instagrams api return but struggling to get the syntax right and its driving me crazy. <img src={feeds.data[0].media_url} /> {feeds.map((feed) => ( &...
0 votes
0 answers
4 views

invalidating query on param change - rtk query

I would like to invalidate data on sortBy param change. However there is something wrong with my implementation because the data is not invalidated on state change. RTK query code: Im using merge ...
  • 155
-1 votes
1 answer
11 views

why the code leads to infinite loop in react

why code leads to infinite loop even when value within setState() is not changing.. we know state do not change if the current value and previous values are same. yet state is changing which is ...
0 votes
1 answer
29 views

Unable to get a reference for an array index

I am trying to delete the list item from the array Tasks[] when the delete button is clicked but I am unable to generate a reference for the specific index of Tasks[]. I am a newbie to react, infact I ...
  • 1
0 votes
0 answers
8 views

Ref.orderBy is not a function w/ firebase and react.js

I am working on a chat message feature but am stumped by this error in my console: messagesRef.orderBy is not a function Here is my current code: firebase.js import firebase from 'firebase/compat/app' ...
0 votes
1 answer
13 views

Console doesn't read the input

Using formik and react, I wanted to create a form and I wanted to increase the reusability of my components, so i made a component "TextInput.jsx" that I'm going to use during my whole ...
0 votes
1 answer
10 views

how to change button name for form Control in react js with bootstrap?

iam using react JS with bootstrap and i add form group to upload my images and videos i want to change the "Choose Files" to some thing else how can i do that there is no docs in bootstrap ...
  • 31
0 votes
0 answers
6 views

Uncaught Error: Cannot find module 'assets/img/angular.jpg' at webpackEmptyContext

I'm trying to understand why if insert this snippet into a my react code it fails inside the map() loop Outside the Loop it works : <img src={require("assets/img/bootstrap.jpg")....
  • 893
-2 votes
1 answer
9 views

TypeError: posts.map is not a function (next.js)

it's my first asking here. I hope, someone can help me: It's simple app with using Next.js and while watching first tutorial video i had this problem: Unhandled Runtime Error TypeError: posts.map is ...
  • 1
0 votes
0 answers
6 views

SAML login redirect in a single page application

I have a MERN stack SPA application with ExpressJS as the backend and ReactJS in the frontend. I'm trying to use SAML authentication from a University's SAML Identity Provider. I have an express API ...
0 votes
0 answers
10 views

User save progress to file in electron/react app

I'm creating an electron app where the user creates and works on a "project." I'm trying to implement a "Save" button so the user can save their progress. I think there are two ...
  • 81
0 votes
0 answers
8 views

Unable to solve PUT request returning Not Found 404 Error between <form> and api

I am trying to write a basic application to add data to a postgresQL database. I am using React with axios on the front end, and Express on the back end. I have managed to write APIs which retrieve ...
  • 1
0 votes
1 answer
17 views

useEffect not updating dependency with queryClient.getQueryData in React Query

I am putting queryClient.getQueryData in dependency of useEffect hook to observer when data updating to cache but the useEffect never trigger update. What is the problem here? My code below: ... ...
  • 353
0 votes
0 answers
7 views

How to correctly test a component with several divs displaying values, from an object, that could possibly have duplicates

I have been following React Testing Library and Jest: The Complete Guide by Stephen Grider on Udemy. In lecture 58 I noticed that one of his solutions for a test would actually fail. The example he ...
0 votes
1 answer
28 views

React passing information to multiple child components

My application has a bunch of child components Card that are used to display different information. When user input changes, some Cards are required to highlight themselves / show a warning / etc. ...
0 votes
0 answers
6 views

Chrome Service Worker Won't register after accidentally manually unregistering service worker

I am developing a React application and just built in a service worker. Everything was working as it should: at localhost:8080 the service worker was precaching/creating routes and responding to those ...
0 votes
0 answers
4 views

Websocket using old state in event callback - React/Socket.io

I'm setting up a real-time chat app using socket.io, but I'm having an issue where old state is being used during an event callback. I'm setting up the event like: useEffect(() => { socket....
  • 318
0 votes
0 answers
6 views

I want to integrate payment system in my react web application

So im developing a MERN web application in which I want to integrate a payment system such that there is money transaction between the user and an external client, making my web app the intermediary. ...
0 votes
0 answers
9 views

How can I create a fake datapoint in Chart.js line chart for the current day label?

In an attempt to create a fake data point on a Chart.js line chart using the spanGaps: true option, I have utilized a null value. However, I have been unable to achieve a fake point for the current ...
  • 20
-1 votes
0 answers
8 views

How can I fix this React Blockchain Bug?

TypeError: Cannot read properties of undefined (reading 'Web3Provider'). I have tried several means but it is not working, It cannot read web3provider don't know what I have to fix
1 vote
1 answer
22 views

How to get the keys of hierarchical json for different levels in reactjs

I have a API response like this- { "Categories": { "Breakfast": { "Poha": { "Description": "This is item ...
  • 1,187
0 votes
0 answers
2 views

Issue with hiding a column by default in Material-Table and toggling its visibility with the ColumnsButton

I am trying to hide a column in Material-Table using the hidden property, while still being able to toggle its visibility using the ColumnsButton. However, when I set the hidden property to true, it ...
0 votes
1 answer
15 views

401 Unauthorized in login route

**getting 401 unauthorized error while trying to login "payload wrong user name" i want complete this project but can't move forward stuck here so please help me solve this error ** Login ...
0 votes
1 answer
10 views

React CountDown renders other component every second

I have created a countdown timer and then called it another component WordSearchContainer along with RandomBoard. **My problem is along with every countdown decrment, it rerenders RandomBoard - ** I ...
0 votes
0 answers
6 views

How to solve too many requests (code 429) in React JS page that call many get production APIs?

I have below React JS file which call many production APIs, there is many requests to these APIs in test the code. I did not why and how to solve the problem. import React, {useState, useEffect} from '...
0 votes
0 answers
13 views

Getting error in react-native-track-player

I make a music app on react native using RN track player. However, after importing it, when I run the code, I get this error: null is not an object (evaluating y.RATING_HEART) Evaluating react-native-...
0 votes
1 answer
26 views

React Native: How to Access Data in Nested Array?

I am trying to access the data in the Array using redux, but I keep getting the Data is undefended , when I use only object it works but when I use objects inside array it does not work. here is my ...
0 votes
0 answers
13 views

React JS -> control the sequence of api call inside useeffect from a component which renders multiple times

The scenario is very straight forward. Let's say , I have a parent component A which gets data from an API as an array of objects ( For example let's say, we get 5 objects). Inside the render method ...
  • 11
0 votes
1 answer
13 views

React Slick Carousel

I'm trying to build an Item page with multiple images that can be flipped through. I use React and Slick Carousel. The page is fetching data correctly and the three dots of the carousel are displayed, ...
  • 13
0 votes
1 answer
29 views

Path of element in api tree

I need to get some data from an api, the api structure looks like : { "data": { "student": { "id": 3568, "name": "Alain&...
  • 546
0 votes
0 answers
16 views

GET http://localhost:1337/api/products 401 (Unauthorized)

Whenever I am trying to fetch data using axios I am getting unauthorized accesss (401 HTTP Status Code) . I checked my API using Postman , there I am able to fetch required data using http://localhost:...
0 votes
0 answers
6 views

Formik resetForm is not clearing the input fields in a react form

I have created a formik form using useFormik hook. On submit i am calling the resetForm method but it is not clearing my input fields. My code looks like this export default CandidateForm() => { ...
-1 votes
1 answer
20 views

How to remove broken images coming via api?

I am writing a project in which I receive data from the server about different films, but in one of the genres a huge number of pictures are broken and it does not come out beautifully. An example to ...
-1 votes
1 answer
22 views

What is the difference between these things?

Suppose i have: const [ num, setNum ] = useState(0); case 1: let newNum = test.getNum(); setNum(newNum); case 2: setNum(test.getNum()); Is there any difference between these in react??
  • 15
0 votes
0 answers
7 views

Cloudinary resources taking too long to fetch on NextJS app deployed in Google Cloud Run

I recently deployed a Next JS application to Google Cloud Run, the app runs just fine except for the fact that the images are taking up to 30 seconds to fetch. Here is a log copied from cloud run (...
0 votes
0 answers
11 views

Calculate video duration onClick and mouse move on progress bar in ReactJS

I am working on a custom video player in reactJS, I am not able to calculate the progress bar percentage on the mouse click and calculate video duration according to mouse click and mouse move. I need ...
  • 342
0 votes
0 answers
11 views

How to do 2 event handlers on the MainButton in Telegram WebApp?

I have a Telegram WebApp with a list of products, so that when i click "add product" button, telegram MainButton appears. Then, when i click on it, i have a pop-up window, where i can view ...
0 votes
0 answers
8 views

I am trying to add a Sitemap.xml to React app

I am trying to add a Sitemap.xml file to a vite-react app which is hosted on Netlify so that it gets listed on google . While submitting it in google search console , it keep throwing an error that ...
0 votes
1 answer
21 views

Aligning element to Stack

I am new to React/MUI, so a little help would be great. I have a Stack of TextFields, they are resizing with the screen width very nicely. <Stack direction="row" sx={{ ...
  • 450
0 votes
1 answer
16 views

Get the percentage of points based on a Javascript calculation

I need to get a percentage to update a progress bar that indicates the points that i have. I update it by passing it as WIDTH a percentage I get from a JS operation to a DIV. I have 3 levels to ...
0 votes
1 answer
16 views

Uncaught (in promise) TypeError: doc2 is not a function at getOrders (ordersList.jsx:27:23)

I want to fetch display_name from user collection to orderList page via UID interpreter and image name from art collection in order table but got this error: https://i.stack.imgur.com/X9bkH.png Here's ...
1 vote
1 answer
25 views

how to render a nested object inside of an object in react js

I want to render an nested object inside of an object.I'm not sure if I'm saying it right but see it for yourself first. I want to show the minimum_system_requirements objects.I mean graphics,os,...
0 votes
2 answers
20 views

Passing a props to call a function is not working

I have a Cancel button. I would like to perform a specific function in another js file when the button is pressed. Here is what I am doing. function Add(props) { const [cancel, setCancel] = useState(...
-4 votes
1 answer
24 views

ReactJS Calculator, just need some feedback [closed]

I have been learning web development on my own for a few months now. After starting ReactJS about ten days ago, I am now starting to tackle some small projects to familiarize myself with the framework....
0 votes
3 answers
37 views

Objects are not valid as a React childd

I have an array object in a nested array which is giving me an error obejcts are not valid, when i am trying to render it in the jsx for printing name and value This is what my data looks like: ...
0 votes
0 answers
18 views

how to take a screenshot in a frame in react

I have created a screenshot app that can take the content off the screen, but here I want to show the frame in that text "this is a text" instead of an image, so how do I make this so that ...
2 votes
1 answer
16 views

How to fix the vertex detection issue when drawing on canvas?

My task is to create a React application in which there is a place for drawing and the user must draw a graph there, after the user draws, I need the highest and lowest points to be determined on this ...
0 votes
0 answers
10 views

Trying To Create PDF From JS Object Sent To Lambda Backend (Node.js Runtime), But I Can't Seem To Find The Error

So I've set up a GET request that calls a Lambda function on my serverless backend. The Lambda function contains a handler and some of the business logic that creates the document (using PDFKit). The ...

1
2 3 4 5
8990