【React|青训营笔记】

39 阅读2分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第 8 天。以下是我在观看学习视频的同时进行的笔记记录,今天学习了好多新知识,感觉好充实!同时也希望大佬们进行补充和改正,大家一起加油努力呀!

概念

它是一个将数据渲染为HTML视图 的js库

原生js痛点

  • 用dom的API去操作dom,繁琐且效率低
  • 用js直接操作dom,浏览器会进行大量的回流和重绘
  • 原生js没有组件化的编程方案,代码复用性低,哪怕有模块化的概念,但模块化也只能拆解一个个js,对样式和结构也没办法拆解,组件化就相当于3剑客整体拆解,成为一个个的小功能

React特点

采用组件化模式,声明式编码,提高开发效率和组件复用性 在React Native中可以用react预发进行安卓、ios移动端开发 使用虚拟dom和有些的diffing算法,尽量减少与真实dom的交互,提高性能

关于创建的虚拟dom

  • 本质上其实就是一个object对象;
  • 虚拟dom上的属性比较少,真实dom属性多,因为虚拟dom只在recat内部使用,用不到那么多的属性
  • 虚拟dom最终会被react转换成真实dom,呈现在页面上

JSX语法

  • 定义虚拟dom时不要用引号
  • 标签中引入js表达式要用{}
  • 如果在jsx要写行内样式需要使用style={{coler:red}}形式
  • 样式的类名指定不能写class,要写className;
  • 只有一个根标签
  • 标签必须闭合
  • 标签首字母 ①若小写字母开头,则会将该标签转为html同名标签,如果没找到,则会报错; ②若大写字母开头,则会认为是组件,它就会去找对应的组件,如果没找到,就会报组件未定义的错误;