React 知识点小结(一):基础

React:facebook公司的框架。2013年开源的项目。

JSX语法:js语法的扩展。JS + XHTML的混写
xhtml语法要求:标签必须封闭。 <input /> <div></div>

虚拟dom:本质是js变量,是和真实dom一样的树形结构。js逻辑操作的是虚拟dom,最终虚拟dom会一次性把结果反映到真实dom上。

脚手架:

npm install create-react-app -g

生成项目:

create-react-app 工程名

注意点

  1. 组件名首字母必须大写
  2. html中的class不能叫class,应该写成className, html中的for不能写成for,应该写成htmlFor
  3. return中只能有一个顶层元素
  4. 事件绑定的写法 on事件名 (事件名的首字母必须大写) 例如:onClick
  5. 事件必须修正this指针
    方式一:<button onClick={this.方法名.bind(this)}>添加</button>
    方式二:在构造器中使用 this.方法名 = this.方法名.bind(this); 推荐这种!!!!
  6. react不是双向绑定框架,因此需要手动通知框架刷新
this.setState({key:value})

return中的循环必须使用map循环。
组件的数据必须放到state中进行管理。相当于vue的data属性。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,610评论 1 45
  • 40、React 什么是React?React 是一个用于构建用户界面的框架(采用的是MVC模式):集中处理VIE...
    萌妹撒阅读 1,038评论 0 1
  • 结合网上和个人总结,仅供参考。 1、HTML&CSS: 1、DOM结构 —— 两个节点之间可能存在哪些关系以及如何...
    FredericaJ阅读 3,951评论 3 7
  • 1.几种基本数据类型?复杂数据类型?值类型和引用数据类型?堆栈数据结构? 基本数据类型:Undefined、Nul...
    极乐君阅读 5,572评论 0 106
  • 明朝皇帝朱厚照有个特殊的癖好,每次论功行赏的时候,都不忘封赏自己一份,兼任皇帝和将军两个角色,随着功劳越大封赏越高...
    逆境突围计划阅读 2,566评论 1 2