(编辑:jimmy 日期: 2024/10/1 浏览:2)
简介
Facebook官网介绍:React 是一个用来构建用户界面的 JavaScript 库。相当于 MVC 架构的 V 层。
React 的核心思想是:封装组件,各个组件维护自己的状态和UI,当状态变更,自动重新渲染整个组件。
React的优点(React为什么这么火?):
组成
React构建界面的三要点:组件、路由、状态管理。
React 的核心内容:JSX和虚拟 DOM。
一个最基本的 React 组件由数据和JSX两个主要部分构成,我们先来看看数据。
这是一个简单完整的React组件(类),props 主要作用是提供数据来源,可以简单的理解为 props 就是构造函数的参数。 state 唯一的作用是控制组件的表现,用来存放会随着交互变化状态,比如开关状态等。JSX 做的事情就是根据 state 和 props 中的值,结合一些视图层面的逻辑,输出对应的 DOM 结构。
在组件内部,可以通过this.props来访问props
React的一大创新,就是把每一个组件都看成是一个状态机,组件内部通过state来维护组件状态的变化,这也是state唯一的作用。
传统 Web App:是直接和DOM交互,由App来控制DOM的构建和渲染、元素属性的读写、事件的注册和销毁等。
React Web App:是通过虚拟DOM来交互。虚拟DOM是在DOM的基础上建立了一个抽象层,我们对数据和状态所做的任何改动,都会被自动且高效的同步到虚拟DOM,最后再批量同步到DOM中。(渲染效率高)
React目前支持的事件列表:
生命周期
大体可以分为三个过程:初始化、更新和销毁,在组件生命周期中,随着组件的props或者state发生改变,它的虚拟DOM和DOM表现也将有相应的变化。
一、初始化:
解析:
对于一个组件来说,render 是唯一一个必须的方法。render方法需要满足这几点:
1)只能通过 this.props 或 this.state 访问数据
2)只能出现一个顶级组件
3)可以返回 null、false 或任何 React 组件
4)不能对 props、state 或 DOM 进行修改
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持!