diff --git "a/\351\273\204\345\230\211\351\222\260/Vue\345\256\236\344\276\213.md" "b/\351\273\204\345\230\211\351\222\260/Vue\345\256\236\344\276\213.md" new file mode 100644 index 0000000000000000000000000000000000000000..9bfebd5af04d8754c4bf1c45e85aa75d0bf7419d --- /dev/null +++ "b/\351\273\204\345\230\211\351\222\260/Vue\345\256\236\344\276\213.md" @@ -0,0 +1,46 @@ +## 2021-5-28 + +### 创建实例 +1. 根实例 ++ 通常情况下,一个项目就是一个实例 + +2. Vue组件 ++ Vue组件是被扩展的Vue实例 ++ 组件分为局部组件和全局组件 + +通过new Vue()方式创建的实例就叫根实例 + +![](./img/Vue实例/1.png) + +### 数据与方法 + +``` +
+ {{thing}} +
+ + + + +``` + +### 生命周期 +![](./img/Vue实例/生命周期钩子图.png) + +1. beforeCreate: 创建了Vue组件实例,但是组件属性还未初始化。比如,data, elt等为undefined。 +2. created: 初始化数据对象和事件,例如:可以访问属性this.$data。这时最适合做ajax请求,初始化需要渲染的数据。 +3. beforeMount: 进行模板编译,但是,模板内容还未插入页面DOM中。 +4. mouted: 将生成好的的模板挂载在DOM树上,并且,组件属性this.$el被赋值。 +5. beforeUpdate: 组件更新之前 +6. updated: 组件更新之后 +7. beforeDestory: 组件销毁之前,这时,已经调用this.$destory()。 +8. destoryed: 组件销毁完毕。这时,组件上的watcher,子组件和事件监听都会被销毁。 diff --git "a/\351\273\204\345\230\211\351\222\260/img/Vue\345\256\236\344\276\213/1.png" "b/\351\273\204\345\230\211\351\222\260/img/Vue\345\256\236\344\276\213/1.png" new file mode 100644 index 0000000000000000000000000000000000000000..05a72bb8a3dacff580932396f76ea0422c3702aa Binary files /dev/null and "b/\351\273\204\345\230\211\351\222\260/img/Vue\345\256\236\344\276\213/1.png" differ diff --git "a/\351\273\204\345\230\211\351\222\260/img/Vue\345\256\236\344\276\213/\347\224\237\345\221\275\345\221\250\346\234\237\351\222\251\345\255\220\345\233\276.png" "b/\351\273\204\345\230\211\351\222\260/img/Vue\345\256\236\344\276\213/\347\224\237\345\221\275\345\221\250\346\234\237\351\222\251\345\255\220\345\233\276.png" new file mode 100644 index 0000000000000000000000000000000000000000..0989f378b73f1d8d3f254b65a69e419ad05324cc Binary files /dev/null and "b/\351\273\204\345\230\211\351\222\260/img/Vue\345\256\236\344\276\213/\347\224\237\345\221\275\345\221\250\346\234\237\351\222\251\345\255\220\345\233\276.png" differ