• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

191
Vistas
React & Mobx: renderizar (a través del método render()) @datos observables que se modificarán después de renderizar el componente especificado

Indique cómo resolver el siguiente problema:

Hay un componente que genera algún contador:

 @observer class MyComponent extends React.Component { render() { const data: MyData = new MyData(); return <div>{data['counter']}</div>; } }

El contador se almacena en un singleton rastreable (a través de mobx @observable):

 export class MyData extends ISingleton { @observable data: any = {} }

En algún momento, el contador (cuando MyComponent ya está creado) se establece el contador

 let data: MyData = new MyData(); data['counter'] = 123;

Pero MyComponent no se vuelve a dibujar, aunque el componente parece rastrear el cambio de variable (a través de mobx @observer y @observable)

Indique dónde está el error y cómo se puede solucionar.

about 3 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

En mobx necesitas manipular el estado de los observadores dentro de las acciones.

Deberías extender tu singleton para que se vea así:

 export class MyData extends ISingleton { @observable data: any = {} @action setCounter(val: number) { this.data = val } }

Luego llame al método setCounter en lugar de manipular el estado directamente.

Tenga en cuenta que, a partir de la versión 6 de MobX, se desaconseja utilizar la API de decoración (consulte esto para obtener más información ).

about 3 years ago · Juan Pablo Isaza Denunciar

0

Cada renderizado crea un nuevo objeto de data completamente nuevo, restableciéndolo de manera efectiva. Por lo tanto, desea almacenar data en la instancia de clase, no dentro del renderizado. Además, los datos que está modificando son datos completamente diferentes a los datos que está representando (eso es lo que hace la new palabra clave). Probablemente quiera leer un poco sobre cómo funcionan los objetos, las clases y las instancias en JavaScript en general.

about 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda