/**
 * vue 实例
 */
var data = {
    'age': 24
};

var vm = new Vue({
    el: '.J-dom',
    data: data,

    // 组件属性计算之前被调用，如:data
    beforeCreate: function() {
        console.log('beforeCreate:' + this.age);
    },

    // 属性绑定完成，但 DOM 为生成
    created: function() {
        console.log('created age:' + this.age);
    },

    // el 或 template 编译挂载之前(存在 el 或者 template 则执行)
    beforeMount: function() {
        console.log('beforeMount:' + this.age);
    },

    // el 或 template 编译挂载之后(存在 el 或者 template 则执行)
    mounted: function() {
        console.log('mounted:' + this.age);
    },

    // 组件更新之前（TODO:未执行）
    beforeUpdate: function() {
        console.log('beforeUpdate:' + this.age);
    },

    // 组件更新之后（TODO:未执行）
    updated: function() {
        console.log('updated:' + this.age);
    },

    // 组件被激活时调用（TODO:未执行）
    activated: function() {
        console.log('activated:' + this.age);
    },

    // 组件被移除时调用（TODO:未执行）
    deactivated: function() {
        console.log('deactivated:' + this.age);
    },

    // 组件被销毁之前
    beforeDestory: function() {
        console.log('beforeDestory:' + this.age);
    },

    // 组件被销毁之后
    destory: function() {
        console.log('destory:' + this.age);
    }
});

// 设置属性会影响原始数据
console.log('data age:' + data.age);
vm.age = 30;
console.log('data age changed:' + data.age);

console.log('vue age:' + vm.age);
data.age = 18;
console.log('vue age changed:' + vm.age);

// vue 暴露属性及方法
console.log('vue data:' + vm.$data);
vm.$watch('age', function(newVal, oldVal) {
	console.log('watch vue new age:' + newVal);
	console.log('watch vue old age:' + oldVal);
});

@@ -24,20 +24,17 @@
 ata = %7B%0A
-    
+%09
 'age': 2
@@ -62,1157 +62,94 @@
 e(%7B%0A
-    el: '.J-dom',%0A    data: data,%0A%0A    // %E7%BB%84%E4%BB%B6%E5%B1%9E%E6%80%A7%E8%AE%A1%E7%AE%97%E4%B9%8B%E5%89%8D%E8%A2%AB%E8%B0%83%E7%94%A8%EF%BC%8C%E5%A6%82:data%0A    beforeCreate: function() %7B%0A        console.log('beforeCreate:' + this.age);%0A    %7D,%0A%0A    // %E5%B1%9E%E6%80%A7%E7%BB%91%E5%AE%9A%E5%AE%8C%E6%88%90%EF%BC%8C%E4%BD%86 DOM %E4%B8%BA%E7%94%9F%E6%88%90%0A    created: function() %7B%0A        console.log('created age:' + this.age);%0A    %7D,%0A%0A    // el %E6%88%96 template %E7%BC%96%E8%AF%91%E6%8C%82%E8%BD%BD%E4%B9%8B%E5%89%8D(%E5%AD%98%E5%9C%A8 el %E6%88%96%E8%80%85 template %E5%88%99%E6%89%A7%E8%A1%8C)%0A    beforeMount: function() %7B%0A        console.log('beforeMount:' + this.age);%0A    %7D,%0A%0A    // el %E6%88%96 template %E7%BC%96%E8%AF%91%E6%8C%82%E8%BD%BD%E4%B9%8B%E5%90%8E(%E5%AD%98%E5%9C%A8 el %E6%88%96%E8%80%85 template %E5%88%99%E6%89%A7%E8%A1%8C)%0A    mounted: function() %7B%0A        console.log('mounted:' + this.age);%0A    %7D,%0A%0A    // %E7%BB%84%E4%BB%B6%E6%9B%B4%E6%96%B0%E4%B9%8B%E5%89%8D%EF%BC%88TODO:%E6%9C%AA%E6%89%A7%E8%A1%8C%EF%BC%89%0A    beforeUpdate: function() %7B%0A        console.log('beforeUpdate:' + this.age);%0A    %7D,%0A%0A    // %E7%BB%84%E4%BB%B6%E6%9B%B4%E6%96%B0%E4%B9%8B%E5%90%8E%EF%BC%88TODO:%E6%9C%AA%E6%89%A7%E8%A1%8C%EF%BC%89%0A    updated: function() %7B%0A        console.log('updated:' + this.age);%0A    %7D,%0A%0A    // %E7%BB%84%E4%BB%B6%E8%A2%AB%E6%BF%80%E6%B4%BB%E6%97%B6%E8%B0%83%E7%94%A8%EF%BC%88TODO:%E6%9C%AA%E6%89%A7%E8%A1%8C%EF%BC%89%0A    activated: function() %7B%0A        console.log('activated:' + this.age);%0A    %7D,%0A%0A    // %E7%BB%84%E4%BB%B6%E8%A2%AB%E7%A7%BB%E9%99%A4%E6%97%B6%E8%B0%83%E7%94%A8%EF%BC%88TODO:%E6%9C%AA%E6%89%A7%E8%A1%8C%EF%BC%89%0A    deactivated: function() %7B%0A        console.log('deactivated:' + this.age);%0A    %7D,%0A%0A    // %E7%BB%84%E4%BB%B6%E8%A2%AB%E9%94%80%E6%AF%81%E4%B9%8B%E5%89%8D%0A    beforeDestory: function() %7B%0A        console.log('beforeDestory:' + this.age);%0A    %7D,%0A%0A    // %E7%BB%84%E4%BB%B6%E8%A2%AB%E9%94%80%E6%AF%81%E4%B9%8B%E5%90%8E%0A    destory: function() %7B%0A        console.log('destory:' + this.age);%0A    
+%09data: data,%0A%0A%09// %E9%92%A9%E5%AD%90%E5%87%BD%E6%95%B0%0A%09created: function() %7B%0A%09%09console.log('%E9%92%A9%E5%AD%90%E5%87%BD%E6%95%B0 age:' + this.age);%0A%09
 %7D%0A%7D)
@@ -539,13 +539,12 @@
 oldVal);%0A%7D);
-%0A

Revert "Vue 实例"