2、React开发基础：JSX、Props、状态管理与渲染机制解析

React开发基础：JSX、Props、状态管理与渲染机制解析

1. JSX简介

JSX 是一种在 React 中使用的 XML 标签形式，用于在 render() 方法中定义组件。它与 HTML 类似，但支持内联 JavaScript，能在运行时控制视觉效果。JSX 的优势在于其名称暗示了它是内联 JS 和 XML 标签的结合。

1.1 嵌入内联 JavaScript

在 JSX 中嵌入内联 JavaScript 很简单，只需将表达式用花括号 {} 包裹。以下是一些常见的嵌入表达式示例：
1. 返回单个变量对象 ：

<Text>{props.title}</Text>
<View style={styles.engine} />

这里， {props.title} 返回 props.title 的值，并将其设置为 <Text> 组件的内容； {styles.engine} 返回 styles.engine 的值，并将其设置为 <View> 的样式属性。
2. 使用常量字符串 ：

<Sectio