react笔记

React是什么

React是用于构建用户界面的JavaScript库。由FaceBook开发的，能简单，快速，高效地开发复杂和交互式的Web和移动UI。优点体现在开发效率、维护、组合扩展、生态、组件化思想等。现在，React有一个很大的支持社区。

React的特点:

1. 声明式。配合使用JSX，以声明式编写UI, 使得代码编写容易，容易理解和维护。
2. 组件化。通过React组件来构建各种UI，组件拥有状态，当状态数据改变时，React能有效地更新并正确地渲染组件。
3. 跨平台。一次学习，随处编写。可以在Web开发中使用，也可以使用 Node 进行服务器渲染，还可以使用基于React的 React Native 开发原生移动应用。

Hello React

因为React本身是一个JavaScript库，所以只要在HTML文件中通过script 标签引入相关的一些js文件，就可以直接用React来编写UI了。

  
    
    
    
    
    
  
  
    

    
    
    
  

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

复制代码在浏览器控制台中打印出React的值，可以看到React是一个对象，有很多的属性。大多的属性的属性值是方法。React.createElement就是我们常用的用来创建React元素。

JSX

JSX(JavaScript XML)是 JavaScript 定义的一套用于描述UI的扩展语法。使用JSX来编写UI，使得代码的可读性更好。在React开发中，经常会使用JSX来写组件。

JSX语法

JSX语法有如下一些规则：

1. 自定义组件使用是必须首字母大写，首字母不大写会直接解析为同名html标签
2. 属性名称用camelCase来定义
3. 对于字符串值，用引号
4. 对于表达式，用大括号，可以在大括号内放置任何有效的 JavaScript 表达式。
5. 一个标签里面没有内容，可以使用 /> 来闭合标签
6. JSX中编写注释用大括号将/* */语句包起来

    
;
    
;
    ;
    {/* 注释写在这里 */}
    Hello, {name}!
    {/* 多行注释 
    也同样有效。 */}

1
2
3
4
5
6
7
8
9

文章参考地址