Questions tagged [react-class-based-component]
230 questions
1
vote
2 answers
ReactJs - can't access setState inside axios call
I'm having troubles setting state to the variable isCorrectAnswer inside an axios call. I'm getting the error Cannot read properties of undefined (reading 'setState') in the console log. What am I doing wrong?
Initial state of isCorrectAnswer…
Alex Furdui
- 37
- 4
1
vote
1 answer
How to automatically take a '/' (slash) in input field using reactJS
How can I format an input to place a slash before the value that the user enters, so that the user cannot delete it because it is already formatted that way. I'm trying to add functionality to input /characters fields so as when the users enters…
Izlia
- 235
- 1
- 2
- 18
1
vote
0 answers
Can we execute code inside setState apart from returning state object.?
I have scenario where i have to set state for two of the properties and i need to get an updated response by passing previous state to a method. I think this approach is fine,
`updateResponse = (updatedRecord, status) => {
this.setState(prevState…
Chetan
- 33
- 5
1
vote
1 answer
How to show the specified table row data based on the filter option in react js
I am new to reactjs. I am showing the json data in the table. I also want to display only specific table row data for the specific filter option.
Here I want when noida is selected then the table should display only 2 nd 3rd row of the table.
when…
Sathish
- 47
- 1
- 9
1
vote
1 answer
How to convern ANTD class-based component to react function-based component
Can anyone give a suggestion on how can I convert Ant Design class-based component into function-based? I am new to class-based, so it is pretty confusing for me to convert class components. Now, my application is a functional-based component. Any…
Wilmer Demata
- 85
- 3
- 16
1
vote
0 answers
JSX is parsing before returning the data from a function in react Js
I am calling a function from the render method to fetch the updated data like this. but i am not getting the data on page because before getting the data my jsx is parsing .
Here is my code
private fetchMessages = async () => {
const isArray =…
Roster
- 1,764
- 6
- 17
- 36
1
vote
3 answers
how to navigate from one page to other page using react-router-dom-v6 in class-based component?
I am using React-router-dom-V6 for navigation with Class Based Component in my WebApp and I want to navigate from one page to another page, how can I achieve this ? in functional component there is Hook named useNavigate(), how to navigate in class…
Rutvik Prajapati
- 188
- 1
- 3
- 11
1
vote
0 answers
How to include the Match object into a Reacts component class?
I am using react router v5, and trying to get URL parameters by props match object into my react component class. However it is not working! What am I doing wrong here?
When I create my component as a JavaScript function it all works fine, but when…
Rajanish Singh
- 23
- 3
1
vote
1 answer
React API call is not working as intended with setState()
So here I'm fetching records by page. At mounting, I fetched page 1 and on next and prev button I'm changing the count, which is changing the page number and making a get request. But my code is not working correctly. It is giving me the result of…
codework
- 25
- 1
- 9
1
vote
2 answers
query-string in react router v6
I show two query strings in my URL like this **localhost3000/?filter=all&search=something**
but the problem is when there isn't anything for search my URL still shows **localhost3000/?filter=all&search=**
while I want to show search if it uses and…
hossein fti
- 900
- 1
- 6
- 12
1
vote
0 answers
How to rewrite a class component with componentWillReceiveProps into a functional component
I'm trying to refactor this React component into a functional component but am not too sure how to handle the componentWillReceiveProps part. I've looked up a few guides and past questions but can't find anything on this aspect specifically.
import…
osint_alex
- 952
- 3
- 16
1
vote
2 answers
React couldn't pass a data from one class component into another using Link
I am trying the pass data to a new page by using Link, in doing so I used the following code.
…
danielmuler
- 11
- 3
1
vote
1 answer
How to render react class component with React HashRouter and Apollo client?
I am working at a project in which I must use only React class components and I am fetching data from an Apollo server.
The problem is that in Chrome is rendering only the Navbar.jsx. When I am navigating on one of the links nothing is on the…
Prgrmist
- 83
- 1
- 9
1
vote
1 answer
creating a piano with react.js, use of state unclear
I'm about to build up a keyboard for a piano and I want to use state in order handel the pressed and non pressed keys (keys that finally generate the sound, so that I can play single notes and chords)
I modified an online tutorial the following way:…
user1953346
- 51
- 7
1
vote
1 answer
Dynamic Forms - How to update the value of multiple form fields on 'onChange' event using react hooks?
Using class-based component, we do it this way for multiple input fields
handleChange(evt) {
this.setState({
[evt.target.name]: evt.target.value;
});
But I want to do it using hooks:
const [newName, setNewColorName] = useState('');
const…
Ashmita Singh
- 69
- 2
- 2
- 11