@composi/observer:

• Instalación
• Observer
• Watch
• Send
• Unwatch

Watch

Los observadores sirven para vigilar los eventos. Para hacerlo, utilizas el método watch del observador. Esto requiere dos argumentos: un evento y un callback para ejecutar cuando ocurre el evento. El callback recibe un argumento que se le pasa automáticamente: cualesquier datos que se hayan pasado con el evento. Un observador no tiene que usar los datos del evento. Puede ignorarlos completamente hacer cualquier otra cosa.

Configuración de Vigilante

import { Observer } from '@composi/observer

const observador = new Observer()
observer.watch('evento-especial', datos => {
  console.log(`Acabo de recibir estos datos: ${datos}`)
})

Ignorar los Datos Recibidos

Este es el mismo vigilante anterior, pero aquí ignoramos los datos:

import { Observer } from '@composi/observer

const observador = new Observer()
observer.watch('evento-especial', datos => {
  // Ignorar los datos:
  console.log('Acaba de ejecutarse el evento especial.')
})

Vigilante sin Datos

Cómo mencionamos, un vigilante no tiene que esperar datos cualesquiera. Puedes escoger solo esperar por el evento.

import { Observer } from '@composi/observer

const observador = new Observer()
// No hay datos para este vigilante:
observer.watch('evento-especial', () => {
  console.log('Acaba de ejecutarse el evento especial')
})

Múlitples Vigilantes para el Mismo Evento

Es posible crear vigilantes múlitples para el miso evento. Tal vez necesites hacer esto cuando hay varios componentes que deben reaccionar al mismo evento. Cuando creas vigilantes múltiples para el mismo evento, cuandoquiera que el evento ocurre, todos los vigilantes se ejecutarán.

import { Observer } from '@composi/observer

const observador = new Observer()
// El primer vigilante para 'evento-especial':
observer.watch('evento-especial', datos => {
  console.log(`El primer vigilante recibió estos datos: ${datos}`)
})

// El segundo vigilante para 'evento-especial':
observer.watch('evento-especial', () => {
console.log('El segundo vigilante se ejecutó!')
})

Por enviar 'evento-especial' los dos vigilantes se ejecutarán.

Para aprender cómo enviar un evento a un vigilante, lee la documentación.

Usar Guardias

Debido a que no puedes saber is un evento va a mandar datos o no, siempre debes de chequear que el callback recibió datos antes de tratar de usarlos.

import { Observer } from '@composi/observer

const observador = new Observer()
observer.watch('evento-especial', datos => {
  // Chequea que llegaron datos con el evento:
  if (datos) {
    console.log(`Acaba de recibir estos datos: ${datos}`)
  // No se mandó ningún evento, así que haz otra cosa:
  } else {
    console.log(`El evento ocurrió pero no recibimos datos algunos.`)
  }
})

In todos los otros ejemplos usaos una cadena simple de texto para los eventos. En realidad los datos pueden ser de cualquier tip. Por eso es ejor que chequees el tipo de los daots anges de tratar de usarlos.

import { Observer } from '@composi/observer

const observador = new Observer()
observer.watch('evento-especial', datos => {
  // Chequea que llegaron datos con el evento:
  if (datos) {
    // Se trata de una cadena de texto:
    if (typeof datos === 'string') {
      console.log(`Acaba de recibir estos datos: ${datos}`)
    // Se trata de una matriz de cadenas:
    } else if(Array.isArray(datos)) {
      console.log('Recibimos esta matriz:')
      datos.map((item, idx) => console.log(`ítem ${idx}: ${item}))
    }
  // Ningún evento fue ejecutado, así que haz otra cosa:
  } else {
    console.log(`El evento ocurrió pero no recibimos datos..`)
  }
})