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,时间)

vue.js的学习1.6

vue.js的学习1.6

猜你喜欢