发表于: 2019-07-23 22:43:47

1 1085


今天完成的事情:(一定要写非常细致的内容,比如说学会了盒子模型,了解了Margin) 
明天计划的事情:(一定要写非常细致的内容) 
遇到的问题:(遇到什么困难,怎么解决的) 
收获:(通过今天的学习,学到了什么知识)

vue - emit 子→父组件传递数据

  • 定义
  • $emit 方法,触发当前实例上的时间,附加参数都会传给监听器回调。 使用emit对象guanji9an的两个点就是 事件名 和 监听器,
  • 传输方法:子组件:
  • 父组件:,子组件的点击button后会触发一个$emit方法,这个方法把事件名向父级组件触发一个事件,然后使用v-on 在父组件上监听这个时间,就像监听一个原生DOM 事件一样;这个例子中父组件监听welcome方法,并执行一个sayHia方法。
  • 传输一个值: 在父组件中使用$emit来访问被抛出到的值;

  • ts 使用:

类型检查 prop验证
  • 定义
  • prop 可以在组件上注册一些自定义特性,当一个值传递给一个prop特性的时候,就变成组件实例的一个属性,一个组件可以有任意数量的prop,任何值都可以传递给prop特性,
  • 类型
  • 可以给people数据指定值的类型,设置方法为,以对象的方式列出
  • 单项数据流
  • prop是的父子之间形成一个单向下行绑定:父级prop的更新数据会流动的子组件中,这种传输数据的方式仅仅是单向的,要是想利用这prop从子组件传输到父组件是不行的。每次父组件发生更新的时候,子组件中所有的prop都会刷新成最新的值。
  • prop传递初始值的时候最好定义一个本地data的属性作为初始值:
  • 需要转换原始值的话:可以这样使用转换:
  • 验证
  • 为组件的prop指定验证要求,类似typescript的类型声明,如果prop传输进来的需求没有被满足,则vue会在控制台中警告,这样能帮助纠正一些错误。
  • 基础类型检查:
  • 多个可能的类型:
  • 带有默认值的数字:
  • 带有默认值的对象: 
  • 自定义验证函数: 
  • 以上验证当prop验证失败的时候 会产生一个控制台的警告
  • ts中使用prop:  @prop( ) 中是类型验证,下面的upperDate是类中的属性和属性的类型;



vue- props 父→子组件通信手段



Set 结构没有键名,只有键值(或者说键名和键值是同一个值),所以keys方法和values方法的行为完全一致。

let set = new Set(['red', 'green', 'blue']);

for (let item of set.keys()) {

  console.log(item);

}

// red

// green

// blue

for (let item of set.values()) {

  console.log(item);

}

// red

// green

// blue

for (let item of set.entries()) {

  console.log(item);

}

// ["red", "red"]

// ["green", "green"]

// ["blue", "blue"]

entries方法返回的遍历器,同时包括键名和键值,所以每次输出一个数组,它的两个成员完全相等



返回列表 返回列表
评论

    分享到