What is MVVM? M:model v:view vm vue model

Data proxy and responsive data

DefineProperty (Object,descriptors) 1, Look at this method object.defineProperty (Object,descriptors)

Function: Defines extension properties for the specified object

  • Get: Used to get the current attribute value callback function

  • Set: The triggered callback function that modifies the current property value and takes the modified value as an argument

  • Accessor properties: setter,getter one for holding values, one for valuing values

// add or modify a property of the object to make it a responsive property (can image other property data)
    Object.defineProperty(obj,'fullName', {get(){
            // Access the property's callback function
            return this.firstName +The '-'+this.lastName;
        },
        set(val) {
            // Sets the callback function for this property
            let arr = val.split(The '-');
            this.firstName = arr[0];
            this.lastName = arr[1]; }})console.info(obj);
    // When I do an assignment, I go to object.defineProperty
    obj.fullName = 'liu-liying';
    console.info(obj);
Copy the code

3. What is a data broker?

When vm. MSG is evaluated, the value returned by Object. DefineProperty GET is the process of the data broker

 let vm = new Vue({
        el:'#root'.data: {msg:'zly'}})console.info(vm.msg);       // Data is the MSG in the VM instantiation object
    console.info(vm._data.msg);// The data is the MSG in the original configuration object
    console.info(vm);
    
Object.defineProperty(vm,'msg', {get(){},set(v){}})Copy the code

The VM will have all of the attributes in data

A VM is a proxy that proxies the data in data

When accessing attributes of the VM, the value of the same attribute in data is returned

When modifying vm attributes, the modification starts with the same attribute value in data

4. What is responsive data

When data changes and the page changes with it, it is called responsive data. That is, the data in data is reactive dataCopy the code