Cómo implementar el enlace de datos bidireccional en vue

El enlace de datos bidireccional de Vue se logra mediante el secuestro de datos y las funciones de publicación-suscripción.

Pasos de implementación:

1. Implemente el oyente Oberver para secuestrar y escuchar todas las propiedades y notificar a los suscriptores cuando cambie alguna propiedad.

2. Implementar un monitor de suscriptores para recibir notificaciones de cambios de propiedad y ejecutar los métodos correspondientes para actualizar la vista.

3. Implemente un analizador (compilado) que escaneará y analizará cada nodo en busca de instrucciones relevantes e inicializará los datos de la plantilla y los suscriptores correspondientes.

El patrón de observador es realmente muy útil, pero en la práctica de JavaScript generalmente implementamos el patrón de observador usando una variante llamada patrón de publicación/suscripción.

Como también puedes ver en la imagen, los dos modos son muy similares, pero existen algunas diferencias notables.

El patrón de publicación/suscripción utiliza un canal de tema/evento entre los suscriptores que desean recibir notificaciones y los editores que inician eventos. El sistema de eventos permite que el código defina eventos relacionados con la aplicación a los que se les pueden pasar parámetros especiales con valores requeridos por los suscriptores.

La diferencia entre el patrón de observador y el patrón de publicación-suscripción:

El patrón de observador requiere que los observadores que quieran recibir notificaciones relevantes deben acceder al observador que inició el evento y registrarse. el evento.

El patrón de publicación/suscripción utiliza temas/canales de eventos (similares a mediadores/intermediarios), lo que reduce las dependencias entre suscriptores y editores.

El patrón de publicación/suscripción permite a los suscriptores implementar un controlador de eventos adecuado para registrarse y recibir notificaciones relevantes transmitidas por el editor.