Soy relativamente nuevo en ReactJS y estoy creando una aplicación con Contexto. En algún momento, necesito obtener uno de los valores del Contexto, hacerlo disponible para editarlo y solo después de enviarlo, cambiar su valor en el Contexto (para evitar actualizar todos los demás componentes). Pensé en hacer algo como esto:

 export default class AComponent extends Component<any, { property?: Property }> { public constructor(props: any) { super(props); } public shouldComponentUpdate(nextProps: any, nextState: { property?: Property }) { return nextState.property !== this.state.property; } public render(): JSX.Element { return ( <AContext.Consumer> {(data) => { // ... this.setState({ ...this.state, property: data.property }); // ... }} </AContext.Consumer> ); } }

Pero incluso con la verificación shouldComponentUpdate , ¡todavía se actualiza 4 veces! Sin ella da error (límite de recursión alcanzado o algo por el estilo).

La pregunta es: ¿Cuál es la forma correcta de trabajar con una propiedad de contexto sin cambiarla hasta el momento en que realmente lo desea?

Quería obtener la propiedad Contexto dentro del constructor, pero descubrí que este formulario está en desuso:

 constructor(props: any, context: AContext) { super(props, context) }

¿Hay alguna otra manera?