发表于： 2019-11-09 22:48:15
0 1013
今天完成的事情：
1 复习资料
明天计划的事情：
1 跟后端商量接口，调试。
2 复习资料
遇到的问题：
1 暂无
收获：
1 复习vue的生命周期
生命周期函数就是vue在某个时间点会自动执行的函数，不用放在methods中(共11个)。
每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数，这给了用户在不同阶段添加自己的代码的机会。
生命周期钩子上的this上下文指向调用他的Vue实例
不要在选项属性或回调函数上使用箭头函数，因为this
1 beforeCreate 实例初始化后，创建Vue实例前的钩子函数
2 created 实例被创建之后调用(挂载还没开始)
template有这个属性的话绑定元素就会按比如"<p>1<p>"这样输出，没有的话就把el对应的html作为模板(声明周期图)
下面3-8钩子在服务器渲染期间不被调用
3 beforeMount 挂载之前被调用，开始挂载编译生成的HTML，此时还没有有将编译出的html渲染到页面上
4 mounted el被新建vm.$el替换，并挂载到实例上后调用，注意它不会承诺所有子组件也都被挂载， 如果你希望等到整个视图都渲染完毕，可以用$nextTick( )
5 beforeUpdate 数据更新时调用，发生在虚拟DOM打补丁前
6 updated 数据更改导致的某个虚拟DOM 重新渲染和打补丁，在这之后会调用该钩子。注意它不会承诺所有子组件一起被重绘(当前组件的标签都会重绘)，如果········如上方法。（初次渲染不会执行这个函数），在data数据更新之后执行。
7 beforeDestroy Vue实例销毁之前执行。在这一步，实例仍然完全可用
8 destroyed Vue实例销毁后调用，调用后Vue实例指示的所有东西都会解绑定，所有的事件监听器会被移除，所有的子实例也会被销毁
9 activated keep-alive 组件激活时可调用
10 deactivated keep-alive 组件停用时可调用
生命周图
2 Vue的组件通信方法
父子组件传值
父子组件就是，比如。html中最外层的根实例绑定的就是父组件，里面的就是子组件
父组件向子组件传值，就是使用子组件的时候通过v-bind:组件属性=' '方式，用组件属性 = '' ，这样获取不到父组件data中的属性(其他具体看官方基础中)
子组件向父组件传值，就是子组件模板中先设一个点击事件的方法，然后在方法内设置this.$emit(向外触发的事件名，要传的属性)，把自定义的事件绑到子组件上“”冒号内写父组件的方法即可
vue里面有个单向数组流的概念，父组件可以通过属性向子组件传递参数。但子组件不能去改变父组件传递的数据，会报警告。
可以把父组件属性，赋值给自身定义的变量，就不会有警告了
非父子组件传值
兄弟组件传值
先通过$emis传给父元素，然后父元素通过标签属性传给子组件，子组件通过props接收
非兄弟组件传值
1官方的数据层框架(Vuex) 2总线机制(Bus/发布订阅模式/观察者模式)
$on(要监听的事件,函数) ，监听的事件发生，on内的函数就执行，函数括号的值就是$emit传递的值
下面的例子主要就是1,2设置bus触发事件，3设置bus监听事件。
返回列表
评论