Me he topado con algo interesante. Cuando creo un nuevo objeto configurando una nueva clave para un método, no lo maneja correctamente cuando intento acceder a él (usarlo). Por favor, vea el ejemplo a continuación:
const cases = [ { instance: instance.mydecorator, triggerEffects: useMyDecorator }, ];entonces quiero recorrer de la siguiente manera:
cases.forEach(({ instance, triggerEffects }) => { instance = [ Story => { triggerEffects(); return <Story />; }, ]; });el ejemplo anterior no funciona: instancia != instancia.midecorador, por lo que la matriz no está configurada correctamente.
Lo que funciona es:
const cases = [ { instance: instance, triggerEffects: useMyDecorator }, ]; cases.forEach(({ instance, triggerEffects }) => { instance.mydecorator = [ Story => { triggerEffects(); return <Story />; }, ]; });¡Cualquier ayuda para comprender este comportamiento sería apreciada! Gracias
El problema con su código es la desestructuración que está utilizando en los parámetros de entrada de devolución de llamada de foreach: esta parte => cases.forEach(({ instance, triggerEffects })... . Cuando hace esto, desestructura el elemento de la matriz, y cuando mira la declaración de su matriz la instancia apunta a algún otro objeto de instancia, por lo que en destructure { instance, triggerEffects } la instancia apuntará a la instancia del lado derecho de su declaración de matriz: básicamente accedió (marcado con ESTE) a const cases = [ { instance: instance(THIS ONE), triggerEffects: useMyDecorator }, ]; y no el del lado izquierdo como esperabas.
Lo que debe hacer es evitar la desestructuración en este caso, ya que no desea modificar esa instancia del lado derecho, sino el elemento real de la matriz. Hazlo así:
cases.forEach(element => { element.instance = [ Story => { element.triggerEffects(); return <Story />; }, ]; });