Estoy trabajando en aprender a reaccionar con un proyecto que ideé.

Tengo un componente principal que tiene una función handleClick:

 handleEmail() { console.log('handle email triggered'); this.setState({ viewDisabled: 'hide', }) }

cuando lo activo desde dentro del mismo componente, como

 <button onClick={this.handleEmail}>handle email</button>

registra "manejar correo electrónico activado" y establece correctamente el estado.

Tengo un componente hijo con un formulario:

 <form onSubmit={this.handleSubmit}> <legend>Enter a valid email to start playing!</legend> <input type="email" value={this.state.value} onChange={this.handleChange} /> <input type="submit" value="Submit" onClick={this.props.handleEmail} /> </form>

llamado en el componente padre como:

 <Email handleEmail={this.handleEmail} onChange={emailHandler} />

Cuando se hace clic en el botón Enviar, aparece y la consola registra "manejar el correo electrónico activado", pero falla con " No se pueden leer las propiedades de undefined (lectura, 'setState') " al intentar establecer el mismo estado que el clic nativo puede establecer Pensaría que estaba haciendo algo mal, pero sigue el mismo patrón que otro componente secundario que funciona con el mismo método y no puedo notar la diferencia. Cualquier idea de lo que esto significa sería útil. Supongo que tiene algo que ver con que el estado no se establezca correctamente en algún lugar del camino. Gracias por adelantado.