Directives

v-if , v-else, v-else-if

Directives

v-for

Directives

Réactivité avec Vue

Comment ça marche ?

Les getters/setters (ES5)

let _name = "joe";

const user = {
    get name() {
        console.log("accès en lecture à la propriété")
        return _name
    },
    set name(value) {
        console.log("accès en écriture à la propriété")
        _name = value
    }
}

Comment ça marche ?

Prochainement dans Vue 3 : les Proxy (ES6)

const _user = { name: "joe" }

const user = new Proxy(_user, {
    get(obj, key) {
        console.log(`accès en lecture à la propriété ${key}`)
        return Reflect.get(obj, key)
    },
    set (obj, key, value) {
        console.log(`accès en écriture à la propriété ${key} 
                     avec la valeur ${value}`)
        return Reflect.set(obj, key, value)
    }
})

Détail du système de réactivité de Vue

AngularJS 1.x : dirty-checking synchrone
Angular 2+ : Zones (~= dirty-checking asynchrone)
React : update manuel (setState)
optimisation manuelle (shouldComponentUpdate)
rendu différentiel vs un DOM virtuel
Vue : update auto (setters / proxies)
optimisation auto (dependency tracking)
rendu différentiel vs un DOM virtuel