Questions tagged [reactjs]

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

0
votes
0answers
3 views

Material-UI SimpleTable event handling

I am looking to obtain the rowData from an event triggered on the material-UI table component. The application I am building is very basic and thus needs just a basic table. I have tried passing ...
1
vote
2answers
15 views

Duplicating authentication data between the store and localStorage

In many React tutorials I have seen the presence of tokens or some other kind of data in localStorage used to drive authentication state in an app. But if I were to make a header/navbar component that ...
0
votes
0answers
8 views

Authorize with Spotify using Nginx reverse proxy for client

I have a docker app running three services: client --> react frontend web --- > flask backend nginx ->- a reverse proxy for both This is the (simplified) project structure: docker-compose-dev.yml ...
0
votes
1answer
15 views

Any component doesn't render after importing react-bootstrap library

After npm init and installation of react, react-dom, bootstrap and react-bootstrap packages, I can't import any component from react-bootstrap library, as import Button from 'react-bootstrap/Button'; ...
0
votes
0answers
12 views

front-end tokenizer for user inputs with insert/order awareness

I'm trying to find a react library or something similar to react-select, but with the ability to insert more tags/tokens between inputs. For example, in this photo, if I were to press the left arrow ...
0
votes
0answers
13 views

How to create a live tv channels list grid using React/Preact JS

Have an requirement to create a live channel list grid using react or preact js with 100% keyboard keys support. Can someone pls help if there are any libraries related to this requirement. On ...
0
votes
2answers
29 views

im getting unhandled issue

im getting the following error issue throw er; // Unhandled 'error' event Here is my Controler.js const router = require('express').Router(); router.post('/api/sendMail', async (req,res) => { ...
1
vote
0answers
17 views

Configuring next.config file

I am using Next.js and want to add the react-semantic-ui, to use one of their login components. On the front-end I am getting this error: ./node_modules/semantic-ui-css/semantic.min.css 11:0 Module ...
-1
votes
0answers
14 views

Dynamic internationalization reactJs

I need to know how to apply dynamic internationalization to my reactjs App, after click on button i need change at runtime my screen. I need to do that from any component. my - App.js const ...
-1
votes
0answers
18 views

React - Select Option Value States

I have a chart where i want to display different Line with data sets. The select component handles the states handleChangeAnotherTeam = (e) => { this.setState({value: e.target.value}); ...
0
votes
2answers
18 views

How render components after fetching data

I have a container called "Recetas" (Receipes) which has inside a component called "Showcase". The idea is that the user can create a request in "Recetas" and when the data is fetched, the container ...
0
votes
0answers
11 views

Enzyme TypeError: _reactDom2.default.render is not a function

I have search all stackoverflow and github issues and haven't found a solution for this. I currently have a project that uses react@15.4.1 and I am trying to set up Enzyme. Whenever I try to Enzyme....
0
votes
0answers
21 views

How to add a google fonts in react native

Every time when I need to include fonts to my React Native project for IOS and Android I start to google searching ‘how to add google fonts in react native’ to make it faster.
0
votes
0answers
6 views

Can react-snapshot map out the paths as S3 requires?

I'm new to React and built a simple app that displays two pages: Home for / Team for /team I'm decent with AWS, so the static build over there with CloudFront needs a path like /team/index.html to ...
-2
votes
1answer
14 views

React native new app problem with creating and running

Today I created my react-native app, launched it in xcode emulator and it was working fine. Then I deleted it and created a new one by react-native init projectname and react-native run-ios. This is ...
0
votes
0answers
10 views

Stubbing a React Context Consumer with Sinon

I'm having some trouble using Sinon v5.0.10 to stub Context.Consumer from React's (relatively) new API. Even after I stub the context consumer, I'm still getting the value in the default context ...
0
votes
1answer
15 views

setState works but the redux state isnt being updated when onClick is fired

Hi so I was trying to update my redux state with a setState and for some reason it will only keep the original state and when I have an onClick fire off a setState it only updates that local state and ...
0
votes
1answer
15 views

TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator))

just trying to render a list of items obtained from my backend but getting this error indicating it's undefined. However, when I check the console log I can see that the component's state definitely ...
1
vote
1answer
26 views

React async / await is not waiting in the calling function - but the called function is executing correctly

I have an image upload method on my react component that calls a helper method in a separate helpers.js class to handle the actual upload, so that I can re-use that method elsewhere in my application. ...
0
votes
0answers
29 views

Wrap TextArea default value

I have a Form TextArea with a default value that is unfortunately sometimes quite big. How can I make it so that the form is expanded to the size of the text? Right now, my form input ADI is truncated ...
0
votes
0answers
14 views

Create React App V2 - Multiple entry points

I'm trying to build a React app with 2 entry points, one for the App and one for the Admin panel. I'm starting with Create React App V2 and following this gitHub issue thread https://github.com/...
0
votes
0answers
16 views

Blocking rendering of specific component

How can prevent the render method to render only the Avatar (id="av") ? Basically the idea is to update the image in the CardMedia via onClick. Since the component will be render again the Avatar ...
0
votes
0answers
7 views

Troubles layering map tiles on top of each other with React, D3v5, openstreetmaps?

I'm trying to have multiple map layers of maps on top of each other using react, d3, and openstreetmaps. I originally got started with React and the react-simple-maps library a few months ago, and so ...
-1
votes
0answers
21 views

What is React Native method of getting user’s input like React’s e.target.innerText

‪please what is React Native’s replacement of React’s e.target.innerText? I’m trying to get what a user click on from TouchableOpacity component ‬
0
votes
0answers
12 views

How do I get my nodejs app deployment to load next build resources (404 console error strips my website of all react components)

Straight up, the same code deployed two different ways: npm run dev on my localhost https://02e7822e.ngrok.io npm start (I assume) on Google App Engine https://testing-234701.appspot.com/ I have to ...
0
votes
1answer
15 views

Making a React Form Group scrollable

I am having difficulty showing a display that is a lot of data, and I cannot see all of the data because it is not scrollable. How could I make this form group scrollable so I can scroll through the ...
0
votes
0answers
8 views

React: Multiple Apollo on Same Page Queries Causing Component to Rerender With Blank Data

I have a few pages that render with a component <SuperSearch /> and another component such as <Students /> or <Courses /> that are being rendered in the same page. Both of these ...
0
votes
1answer
20 views

Connecting to Websockets: failed: Connection closed before receiving a handshake response

Help!! I am building my first REACT app, a simple SPA chatroom like-client and am trying to set up a websocket for it. At this stage I simply want to output 'Connected to server' to the console in ...
0
votes
1answer
17 views

how to sort “toggle” data on click?

I'm wondering if is it possible to toggle/onClick data and sort it for instance from A to Z & Z to A but without creating multiple methods. I have some sorting functions but I want this to be a ...
0
votes
2answers
31 views

Why isn't the clickHandler updating state?

I am attempting to set a background that changes with the active button, the clickHandler will show me the correct id of button but then fails to update the state...something i missed? import React, {...
0
votes
0answers
31 views

Create a Typescript + React common library

I try to create a common React and Typescript common library, and I run into too many difficulties in configuring the project workspace in order to develop both library and app altogether project ├─ ...
0
votes
0answers
37 views

iterating a nested js object

I am using the jsonplaceholder as my state for react app. when I iterate through the nested object to display I could not make it work. For example I take two of this state = { post: [ { id: 1,...
1
vote
1answer
16 views

I'm looking for real-life example of React testing with Jest & Enzyme

I know my question is very abstract, but I'm struggling to understand what exactly should/shouldn't be tested in React app. What I'm looking for: Something like Git repository of popular project with ...
0
votes
0answers
9 views

How to setup asp.net core 2.2 with reactjs for development on IIS?

I am trying to develop ASP.NET Core 2.2 with ReactJS Client on IIS. Now, I managed to setup environment by not using user home folder as location for npm, and also managed to run it by setting up ...
-1
votes
1answer
25 views

why props is used instead of state in state component in below provided link?

I want code, to track live location using react.js so I have gone through this below provide link and I just want to know why props is used instead of state in state full component ? https://www....
0
votes
1answer
28 views

Cannot implement TabBarIOS due to TypeError

I cannot impelment TabBarIOS. The code below renders an "Unhandled JS Exception: TypeError: Cannot read property 'Item' of undefined" I have minimal dependencies "react": "16.8.3", "react-native": "0....
0
votes
0answers
13 views

How to pass multiple redux form fields to one backend field

Currently, when I submit a redux-form, and send the data-transfer-object to the backend, there is a backend object that accepts the data and creates an object (I am using Spring Boot Framework in the ...
0
votes
1answer
21 views

To Do List: Delete Button Removes Info from Wrong List Item

I am creating a basic React application which is essentially a to do list. The user can enter text and add an item to the list, which is an array that is rendered with the map method. Each item can ...
0
votes
1answer
29 views

React get data from state [on hold]

I have this function: addEntry = e => { this.setState({[e.target.id]: [...this.state.[e.target.id], 'New Entry']}, () => {console.log(this.state)}) }; I want to concat data in the state ...
1
vote
1answer
31 views

How to handle exit app in one screen not in the whole app - React Native?

I have some issue with BackHandler, the issue is when running the app and go to the let's say Sign Up screen and touch the back in my mobile they will run the function and show the Alert to confirm, ...
0
votes
0answers
25 views

Node JS: best practices for authentication [on hold]

i've created authentication with nodejs & reactjs and the main thing i want to ask is about the logic i used for that. structure is like this: for example user entered to my website, my code ...
-1
votes
1answer
14 views

onRequestClose in Modal not work in react-native

I use below code for Modal <Modal animationType='slide' transparent={true} visible={this.state.modalVisible} onRequestClose = { ()=> {console.log("...
0
votes
1answer
24 views

Can't delete an element from my store and upgrade my component

Here is my component i just list some elements import React, {Component} from "react"; import {connect} from "react-redux"; import { delFruit} from "../../js/actions/index"; function ...
0
votes
2answers
26 views

How can I write two words as a single string(ex:- Course Name) in React.js to render a file>

I Basically want to import a file from API that has the string name as "Course Name" and due to the space I am unable to render it. const CardList = ({ courses }) => { return ( ...
1
vote
1answer
28 views

Component not updating on Map (dictionary) state change using hooks

I have a child component that is supposed to display names based on a visibility filter with checkboxes. I use a dictionary to keep track of the checked state for each name. However, when I update the ...
0
votes
0answers
6 views

react-ga: Before executing “ReactGA.pageview” or “ReactGA.event”, every time do I need to run “ReactGA.initialize”

Software Stack: React I am trying to get my website analytics, for this, I am using react-ga library. I set up the code, but I have confusion, do I need to run ReactGA.initialize every time before ...
1
vote
2answers
26 views

Should I split props when passing to sub-components

I have a React User Profile page that retrieves User object from back-end. User profile object contains a lot of fields (about 30). I learnt that it is good practice in Typescript to create IUser ...
0
votes
1answer
16 views

React in Django or React as a standalone?

I have been researching how to create django react application and the best way to go about implementing it. From this link on creating a django react app states a few way to go about implementing it. ...
0
votes
0answers
10 views

Positioning Components on Render Relative to Unknown Size of Other Components

I'm developing a Node JS App using Electron and rendering the UI using React. Simply, the user enters print commands in a word-processor component on the left side of the UI, and React interperets ...
0
votes
0answers
16 views

Passing a dynamic JSON into a react treeview (treebeard)

I am using a react-based treeview component (https://github.com/storybooks/react-treebeard) for a personal web app. The code pasted below is taken from Treebeard's example folder. The treeview gets ...

http://mssss.yulina-kosm.ru