Tengo una clase Bluetooth y un método de escucha. Quiero actualizar mi estado en la clase de Bluetooth y lo mostraré en el componente funcional.
Clase JavaScript
import React, { Component } from "react"; import { MySampleContext } from "../../contexts/MySampleContext"; export class BluetoothClass extends Component { static contextType = MySampleContext; sampleBluetoothListener(value){ this.context.updateMyState(value); } }Este es mi error.
TypeError: undefined no es un objeto (evaluando 'this.context.updateMyState')
Sí, puede pasar datos a su árbol de componentes utilizando la API de contexto.
// Context file import React from 'react'; const FormContext = React.createContext(); export default FormContext; // Parent Class Component import FormContext from "../context"; class ParentClass extends Component { state = { name: "John Doe" }; render() { return ( <FormContext.Provider value={this.state.name}> <ChildClass /> </FormContext.Provider> ); } } // Child Class Component import FormContext from "../context"; class ChildClass extends Component { render() { return ( <FormContext.Consumer> {(context) => { console.log(context); }} </FormContext.Consumer> ); } }La propiedad de valor en la API de contexto toma un objeto, en el que puede agregar un método que cambie su estado y pasarlo a su árbol de componentes.
Le aconsejo que eche un vistazo rápido a los documentos oficiales de API de contexto de React para una mejor comprensión.
Gracias por todas las respuestas. Pero me refiero a la "clase javascript" pura, no al componente, sin renderizar y los ganchos de reacción están basados en componentes. Finalmente resuelvo el problema con las funciones de devolución de llamada.