内容简介
《React与React Native 跨平台开发：使用JavaScript与TypeScript构建网页端、桌面端和移动端应用》详细阐述了与 React和 React Native相关的基本解决方案，主要包括为什么选择 React、使用 JSX渲染、理解 React组件和 Hooks、React方式中的事件处理、打造可复用组件、 TypeScript类型检查和验证、使用路由处理导航、使用延迟组件和 Suspense进行代码分割、用户界面框架组件、高性能状态更新、从服务器获取数据、 React中的状态管理、服务器端渲染、 React中的单元测试、为什么选择 React Native、React Native内部机制、快速启动 React Native项目、使用 Flexbox构建响应式布局、屏幕间的导航、渲染项目列表、地理位置与地图、收集用户输入、响应用户手势、显示进度、展示模态屏幕、使用动画、控制图像显示、离线使用等内容。此外，本书还提供了相应的示例、代码，以帮助读者进一步理解相关方案的实现过程。
目录
第1部分 React
第 1 章 为什么选择 React 3
1.1 React 是什么 3
1.1.1 React 仅仅是视图层 3
1.1.2 化繁为简 4
1.1.3 声明式 UI 结构 5
1.1.4 数据随时间变化 7
1.1.5 性能至关重要 7
1.1.6 正确的抽象级别 9
1.2 React 的新功能 10
1.3 搭建一个新的 React 项目 11
1.4 使用 Web 打包工具 12
1.4.1 使用框架 13
1.4.2 在线代码编辑器 13
1.5 本章小结 14
第 2 章 使用 JSX 渲染 15
2.1 技术要求 15
2.2 第一个 JSX 内容 15
2.3 渲染 HTML 17
2.3.1 内置 HTML 标签 17
2.3.2 HTML 标签约定 18
2.3.3 描述 UI 结构 19
2.4 创建自己的 JSX 元素 20
2.4.1 封装 HTML 20
2.4.2 嵌套元素 21
2.5 使用 JavaScript 表达式 23
2.5.1 动态属性值和文本 23
2.5.2 处理事件 24
2.5.3 将集合映射到元素 26
2.6 构建 JSX 片段 28
2.6.1 使用包装元素 29
2.6.2 使用片段 29
2.7 本章小结 30
第 3 章 理解 React 组件和 Hooks 31
3.1 技术要求 31
3.2 React 组件简介 31
3.3 组件属性是什么 32
3.3.1 传递属性值 33
3.3.2 默认属性值 35
3.4 组件状态是什么 35
3.5 React 钩子 36
3.5.1 使用钩子维护状态 36
3.5.2 初始状态值 37
3.6 执行初始化和清理操作 40
3.6.1 获取组件数据 40
3.6.2 取消操作和重置状态 42
3.6.3 优化副作用行为 44
3.7 使用上下文钩子共享数据 45
3.8 使用钩子进行记忆化处理 46
3.8.1 useMemo() 钩子 46
3.8.2 useCallback() 钩子 47
3.8.3 useRef() 钩子 48
3.9 本章小结 49
第 4 章 React 方式中的事件处理 51
4.1 技术要求 51
4.2 声明事件处理程序 51
4.2.1 声明处理函数 52
4.2.2 多个事件处理程序 52
4.3 声明内联事件处理程序 53
4.4 将处理程序绑定到元素 53
4.5 使用合成事件对象 54
4.6 理解事件池化 56
4.7 本章小结 57
第 5 章 打造可复用组件 59
5.1 技术要求 59
5.2 可重用的 HTML 元素 59
5.3 单体组件的难点 60
5.3.1 JSX 标记 60
5.3.2 初始状态 61
5.3.3 事件处理程序实现 62
5.4 重构组件结构 64
5.4.1 从 JSX 开始 65
5.4.2 实现文章列表组件 66
5.4.3 实现文章项目组件 68
5.4.4 实现 AddArticle 组件 69
5.5 渲染属性 70
5.6 渲染组件树 72
5.7 本章小结 73
第 6 章 TypeScript 类型检查和验证 75
6.1 技术要求 75
6.2 了解预期行为 75
6.2.1 属性验证的重要性 75
6.2.2 属性验证的缺失可能导致的潜在问题 76
6.2.3 属性验证的选项 76
6.3 TypeScript 简介 78
6.3.1 为什么要使用 TypeScript 79
6.3.2 在项目中设置 TypeScript 80
6.3.3 TypeScript 中的基本类型 82
6.3.4 接口和类型别名 85
6.4 在 React 中使用 TypeScript 86
6.4.1 在 React 组件中对属性进行类型检查 86
6.4.2 类型状态 88
6.4.3 事件处理器的类型定义 89
6.4.4 上下文类型检查 89
6.4.5 引用类型检查 90
6.5 本章小结 91
第 7 章 使用路由处理导航 93
7.1 技术要求 93
7.2 声明路由 93
7.2.1 Hello Route 94
7.2.2 解耦路由声明 95
7.3 处理路由参数 98
7.3.1 路由中的资源 ID 98
7.3.2 查询参数 101
7.4 使用链接组件 103
7.4.1 基本链接 103
7.4.2 URL 和查询参数 104
7.5 本章小结 106
第 8 章 使用延迟组件和 Suspense 进行代码分割 107
8.1 技术要求 107
8.2 使用 lazy() API 107
8.2.1 动态导入和捆绑包 108
8.2.2 组件延迟加载 109
8.3 使用 Suspense 组件 109
8.3.1 顶层 Suspense 组件 109
8.3.2 使用旋转图标回退 111
8.4 避免使用延迟组件 112
8.5 探索延迟页面和路由 114
8.6 本章小结 115
第 9 章 用户界面框架组件 117
9.1 技术要求 117
9.2 布局与组织 117
9.2.1 使用容器 118
9.2.2 构建响应式网格布局 119
9.3 使用导航组件 122
9.3.1 Drawer 导航 122
9.3.2 使用标签导航 125
9.4
前言/序言
近年来，React和React Native已经在JavaScript开发人员中表现出了其所受欢迎的程度，成为全面、实用的React生态系统指南的首选方案。本书包含React的最新功能：增强和修复，同时兼容React Native，涵盖现代跨平台应用程序开发中的关键功能和概念。
从React的基础知识到Hooks、服务器渲染和单元测试等流行特性，本书以循序渐进的方式帮助读者成为一名专业的React开发者。
读者首先从学习React组件的基本构建块开始。然后将学习如何使用TypeScript提升组件的稳定性。随着内容的不断深入，读者将学习应用开发的更高级功能，并将所学知识应用于为Web和原生平台开发用户界面组件。
到本书结束时，读者将能够独立构建适用于Web的React应用程序和适用于多个平台（包括Web、移动和桌面）的React Native应用程序。
读者对象
本书面向任何希望开始学习如何使用React和React Native进行网页端、桌面端和移动端应用开发的JavaScript开发者。读者不需要事先了解React。然而，为了能够理解本书所涵盖的内容，读者需要具备JavaScript、HTML和CSS的基础知识。
本书内容
全书共分28章，主要内容如下。
第1章描述React是什么以及为什么要用它来构建应用程序。
第2章介绍JSX的基础知识，这是React组件所使用的标记语言。
第3章介绍React应用程序中组件和Hooks的核心机制。
第4章概述React组件如何处理事件。
第5章通过示例讲解重构组件的过程。
第6章描述React组件经历的各个阶段，以及为什么对React开发者来说很重要。
第7章提供大量示例，展示如何为React Web应用设置路由。
第8章介绍代码分割技术，这些技术可以带来性能更好、更高效的应用程序。
第9章概述如何开始使用MUI，这是一个用于构建用户界面的React组件库。
第10章深入探讨React中支持高效状态更新和高性能应用程序的新特性。
第11章讨论如何可以使用各种方式从服务器检索数据。
第12章涵盖使用Redux和MobX等流行解决方案在应用程序中的管理状态。
第13章探讨如何使用Next.js构建在服务器和客户端渲染内容的大型React应用程序。
第14章讲述专注于使用Vitest进行单元测试的软件测试。
第15章描述React Native库是什么以及它与原生移动开发的区别。
第16章提供React Native架构的概览。
第17章介绍如何开始一个新的React Native项目。
第18章描述如何创建布局并添加样式。
第19章展示在应用中切换屏幕的方法。
第20章描述如何在应用程序中实现数据列表。
第21章解释如何追踪地理位置并在应用中添加地图。
第22章讨论如何创建表单。
第23章提供如何处理用户手势的示例。
第24章向读者展示如何处理进程指示和进度条。
第25章考察如何创建对话框模态视图。
第26章描述如何在应用中实现动画。
第27章概述在React Native应用中如何渲染图像。
第28章展示当手机没有互联网连接时如何处理应用的问题。
背景知识
本书假定读者对JavaScript编程语言有基本的了解。同时假定读者会跟随示例进行操作，这需要一个命令行终端、一个代码编辑器和一款网络浏览器。第1章将学习如何搭建一个React项目。
学习React Native的要求与React开发相同，但要在真实设备上运行应用，需要先准备一个Android或iOS系统的智能手机。为了在模拟器上运行iOS应用，需要使用Mac计算机。至于使用Android模拟器，则可以使用任何类型的个人计算机。
