生命周期的流程图
生命周期的应用场景
| 钩子函数 | 状态 |
|---|---|
| beforeCreate | 创建前的状态 |
| created | 创建完毕的状态 |
| beforeMount | 挂载前的状态 |
| mounted | 挂载结束的状态 |
| beforeUpdate | 更新前的状态 |
| update | 更新完成的状态 |
| beforeDestroy | 销毁前的状态 |
| destroyed | 销魂完成的状态 |
父子组件传值
在父组件里面引子组件
在父组件里面动态传值给子组件,并定义自定义事件来接收子组件传来的值
在子组件里面接收父组件传过来的值 并设置一个点击事件 把要修改的值通过this.$emit传给父组件
this.$emit
父组件里面的 @changeText="changeText" 前面的changeText是传给子组件的自定义事件, 后面的changeText是父组件里面调用的函数
在子组件里面添加一个click事件点击的时候通过this.$emit触发自定义事件并传值给父组件
兄弟传值
在共同的父组件里面调用子组件
定义一个bus.js 中间件
在子组件里面引用bus.js
定义一个点击事件 引用bus.js 执行点击事件 使用bus.$emit触发自定义事件 去往兄弟组件传值
在里面定义一个值 在生命周期里面监听自定义事件,来接收传递过来的值并修改值