Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

317
Views
La aplicación NextJS, atascada, no puede leer la propiedad de indefinido (leyendo setState) dentro de un método

He vinculado el método a this dentro del constructor. También he usado el truco de la función de flecha para intentar que esto funcione correctamente. Sin embargo, sigo recibiendo este error:

 Unhandled Runtime Error TypeError: Cannot read properties of undefined (reading 'setState') Source components\home\cta\cta.js (14:9) @ _callee$ 12 | submitSubscriber = async (e, stateEmail) => { 13 | e.preventDefault() > 14 | this.setState({loading: true}) | ^ 15 | const res = await fetch('http://localhost:5000/subscribe/add', { 16 | method: 'POST', 17 | body: JSON.stringify({ email: stateEmail }),

Mi código para este componente está a continuación:

 import React, { Component } from 'react'; import ctastyle from '/styles/home/cta.module.css' export default class CTA extends Component { constructor(props) { super(props) this.state = { email: '', response: '', loading: false } this.submitSubscriber = this.submitSubscriber.bind(this) } submitSubscriber = async (e, stateEmail) => { e.preventDefault() this.setState({loading: true}) const res = await fetch('http://localhost:5000/subscribe/add', { method: 'POST', body: JSON.stringify({ email: stateEmail }), headers: { 'Content-Type': 'application/json' } }) const data = await res.json() this.setState({loading: false}) this.setState({email: '', response: data.response[0]}) } renderMessage(mess) { if (mess == 200) { return ( <div className={ctastyle.successMessage}> <h3>Successfully Signed Up!</h3> </div> ) } else if (mess == 400) { <div className={ctastyle.errorMessage}> <h3>Looks like that email has signed up already!</h3> </div> } } render() { return ( <div className={ctastyle.ctaHousing}> {this.renderMessage(this.state.response)} <h2>SUBSCRIBE TO OUR MAILING LIST</h2> <h4>Get our newsletters and new content!</h4> <form> <input placeholder='youremail@email.com' value={this.state.email} onChange={e => this.setState({ email: e.target.value })} /> <button onClick={e => this.submitSubscriber(e, this.state.email)}>Sign Up</button> </form> </div> ) } }

Sé que alguien se ha topado con esto antes, si alguien tiene alguna pregunta o respuesta, ¡hágamelo saber!

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Creo que su problema puede radicar en el uso de async en este contexto como lo hace en la línea 12. Creo que debería llamarse como async submitSubscriber (args) {code} en lugar de la forma en que lo ha hecho.

Fuente: https://www.valentinog.com/blog/await-react/

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!