学习打卡Day5

Day5

今天主要学习了一下React,通过官方文档学习,跟着示例代码自己敲一下,主要学习了如下:

  • JSX语法——大括号。
  • Fragment 标签:一个空标签,如果需要传递props就需要全写。
  • props组件通信:类似于vue原生标签的<div :props="myProps”></div>这种写法。
    • 其中key这个是特殊的props,子组件无法拿到,为了优化React渲染设计。
  • 条件渲染:主要是了解了{condition && ifTrue} 这种写法。
  • React严格模式,会渲染两次组件。
  • 补漏JS知识点:
    • 箭头函数:()=>{}()=>()的区别,前者返回值需要显式return,后者括号中直接就是返回值。
    • it.map():其中有两个参数,一个callback函数(需要有返回值),一个this指向,其中callback函数里有三个可选参数,1当前遍历对象,2下标,3原迭代对象。
    • it.filter():如上,一个callback函数(需要有返回值),一个this指向,这个方法主要用于过滤迭代对象中的某些值。
    • ...展开符:例如person = {id=1, name:'AAA'}使用展开赋值,xiaoMing = {...person, name:'xiaomMing'}则因为展开后有的name与后面自定义的name重复,则会忽略展开后name:'AAA'
  • html事件传递:事件传递是从子元素传递到父元素,逐级向上。可以使用event.stopPropagation()来阻止事件向上传递。区别event.preventDefault()这个是用来阻止某些标签的默认事件。

React感觉就是难一点,比Vue难写一点,每一个dom节点都是函数return出去的,看了文档说好像都不是真实dom,只是对dom的描述,写出来的都是虚拟dom的感觉。写React发现自己js的漏洞有点多......

大概就是这么多吧,争取明天学完state相关内容,后天看完全部文档!加油吧!

0个评论
点击登录,快来和大家讨论吧~
表情
图片
暂无评论
泛舟
下载 APP