vue.png
组件通信
1、父传子
父组件：<div :message="data"></div> // 动态绑定值用v-bind 例子中的“：”为简写
子组件：props: ['data'] // 在数据中用传过来的值,不能随意更改
注：** props的值是单项流动的，并不会从子组件返回父组件。
具体参考：https://www.jb51.net/article/117447.htm
2、子传父
子组件用$emit来向父组件派发事件，
父组件中用$on来监听自定义的事件
3、兄弟通信
a.在父组件data中在实例化一个vue实例
b.在子组件A中 $emit触发传值
c.在子组件B创建的钩子函数中用$on接收值
生命周期：
- 1、什么时候使用
beforeCreate ------ el和data并未初始化
created -------------- el没有，data初始化
beforeMount ------- data初始化，el未挂载
mounted ------------ 挂载完成（也就是模板中的HTML渲染到了HTML页面中）
beforeUpdate ------ 更新前
updated -------------- 更新后
beforeDestroy ------ 销毁前
- 2、怎么使用？
beforeCreate：可以在这里加一个loading
created：loading结束做一些初始化操作
mounted：ajax请求，配合路由钩子做一些事情
beforeDestory：你确认删除吗？
destoryed：当前组件已被删除，清空相关内容
- 3、created和mounted的区别：
created:在模板渲染成html前调用，即通常初始化某些属性值，然后再渲染成视图。
mounted:在模板渲染成html后调用，通常是初始化页面完成后，再对html的dom节点进行一些需要的操作。
网友评论