vue.js的学习1.6
vue默认情况下,子组件也没法访问父组件数据.
如果在html里面命名为my-msg–>则在js里面要写成驼峰命名—> myMsg
组件数据传递:
1. 子组件就想获取父组件data
在调用子组件:
子组件之内:
1.props:['m','myMsg']
2.props:{
'm':String,
'myMsg':Number
}
2. 父级获取子级数据
*子组件把自己的数据,发送到父级
vm.$emit(事件名,数据); //发送数据
v-on: @ //接收数据
父组件和子组件:
子组件想要拿到父组件数据:
通过 props
之前,子组件可以更改父组件信息,可以是同步 sync
现在,不允许直接给父级的数据,做赋值操作
问题,就想更改:
a). 父组件每次传一个对象给子组件, 对象之间引用 √
b). 只是不报错, mounted中转
3.可以单一事件管理组件通信: vuex
var Event=new Vue();
//发送数据
Event.$emit(事件名称, 数据)
//接收数据
Event.$on(事件名称,function(data){
//data
}.bind(this));
4.生命周期(2.0)
beforeCreate 组件实例刚刚被创建,属性都没有
created 实例已经创建完成,属性已经绑定
beforeMount 模板编译之前
mounted 模板编译之后,代替之前ready *
beforeUpdate 组件更新之前
updated 组件更新完毕 *
beforeDestroy 组件销毁前
destroyed 组件销毁后
5.去掉了隐式一些变量(2.0对比1.0)
$index $key
之前:
v-for="(index,val) in array"
现在:
v-for="(val,index) in array"
6.自定义键盘指令
之前:Vue.directive(‘on’).keyCodes.f1=17;
现在: Vue.config.keyCodes.ctrl=17
7.延迟事件(2.0)
debounce 废弃
改用 -> lodash
_.debounce(fn,时间)