Breve vue principio vinculante bidireccionales de datos

MVVM

Ver el nombre de modelo de vista MVVM es el modelo
MVVM consta de tres partes son:
M: Model
V: View
la máquina virtual:ViewModel

En MVVM en modelo de vista en una carpeta, o en el motor de enlace de datos. Debemos declarar qué parte de algo con los datos en la vista del modelo (ver) se muestra en la unión View. Cuando los datos de actualización sobre el modelo modelo de vista, la línea de datos se pasarán automáticamente Carpeta Vista. Por el contrario, cuando el usuario hace funcionar Vista, datos de carpeta se actualizará automáticamente al modelo. Esta es una de dos vías de enlace de datos.
Aquí Insertar imagen Descripción

vue principio vinculante bidireccionales de datos


vueCreación de vmtiempo, los datos se dispone para el ejemplo, y luego Object.definePropertyel método para añadir datos dinámicos gettery settermétodos.

Cuando la adquisición de datos, se disparará el correspondiente gettermétodo, el momento en el que los datos de configuración, que corresponde a la activación settermétodo.

Luego, cuando setterla completa método gatillo tiempo, el gatillo interno paso watcherse completa, cuando los cambios de datos, ver la operación de actualización.

Vue secuestrado por los datos internos y publicar suscribir el modelo de datos para lograr la unión de dos vías

Datos secuestrado por método Object.defineProperty para todos los datos, los datos se añade de forma dinámica a los métodos getter y setter.

Cuando cambian los datos anunciados a los abonados (Vigilante), disparador de respuesta de devolución de llamada oyente.

Aquí Insertar imagen Descripción
Object.defineProperty ( obj, attr, desc)
El método de los tres parámetros son

  • obj: necesidad de definir o modificar las propiedades de un objeto;
  • attr: necesidad de definir o modificar la propiedad;
  • desc: este descriptor atributo (descriptor y el acceso de datos que comprende un descriptor), pasado como un parámetro de un objeto, el parámetro tiene seis opciones:
  1. Valor: el valor del atributo de configuración;
  2. escribible: Boolean, si el atributo es de escritura (si se debe cambiar su valor);
  3. se obtiene booleana, que puede ser atravesada propiedad (por ... en, Object.keys similares);: enumerable
  4. configurable: Boolean, establecer si la propiedad puede ser suprimido, y además de otra de escritura si el descriptor puede ser modificado;
  5. llegar: función de devolución de llamada de función se ejecuta cuando se adquiere el valor de la propiedad (por ejemplo console.log (prop)), el valor predeterminado es indefinido;
  6. conjunto: la función de devolución de llamada se ejecuta cuando se establece la función, el valor de la propiedad, el valor predeterminado es indefinido;

Object.defineProperty deficiencias vue3 en.

1、无法监听es6的Set、Map 变化; 

2、无法监听Class类型的数据; 

3、属性的新加或者删除也无法监听; 

4、数组元素的增加和删除也无法监听。

Entendimos a través de un ejemplo sencillo

		var obj = {}
        let middel = 123
        Object.defineProperty(obj,"msg",{
            get(){
               
                return middel
            },
            set(val){
                middel = val
            }
        })

        console.log(obj.msg)   //获取对象的属性的时候,会调用自身的get方法   返回123
        obj.msg = 123456           //设置对象的属性的时候,会调用自身的set方法
        console.log(obj.msg)   //123456

Cuando imprimimos obj.msg cuando MSG es para obtener el valor de la obj, entonces él iría desc llamada al método get, obtenemos el valor de retorno middel, imprimir 123. obj.msg = 123456 se asigna a la obj msg, llamada al método establecido este tiempo se desc 123456 val pasado como un parámetro, y luego asignada a la val middel, esta vez middel = 123.456. Nos valor devuelto al imprimir obj.msg nuevo es 123456.

Publicado 21 artículos originales · ganado elogios 0 · Vistas 296

Supongo que te gusta

Origin blog.csdn.net/weixin_43861707/article/details/104952249
Recomendado
Clasificación