React中一些小的基本知识点

JSX简介

JSX就是Javascript和XML结合的一种格式。React发明了JSX,可以方便的利用html来创建DOM,当遇到 < ,JSX就当做HTML解析,遇到 { 就当做javascript进行解析。

组件和普通JSX语法区别
自定义组件必须首字母大写,而JSX是小写字母开头的。

组件外层包裹原则
这是一个很重要的原则,因为React要求必须在一个组件的最外层进行包裹。
错误代码:
在控制台也已经报出相应的错误所以我们在写一个组件的时候,组件的最外层都需要有一个包裹。

Fragment标签
加上最外层的DIV,组件就完全正常了,但如果布局就偏不需要最外层的标签怎么办?React 为我们提供了Fragment标签。
要想使用,需要先进行引入。
在这里插入图片描述在上面错误代码中,render内,代码的最外层加上Fragment标签即可。

响应式设计和数据绑定
React不建议你直接操作DOM元素,而是要通过数据进行驱动,改变界面中的效果。React会根据数据的变化,自动的帮助你完成界面的改变。所以在写React代码时,你无需关注Dom相关的操作,只需要关注数据的操作就可以了。

JSX代码注释 多行注释: { /* 正确注释的写法 */ } 单行注释: { //正确注释的写法 }