Logo
☆☆☆☆☆
0.0
Intermediate
27h

在 React Native 中简化状态管理

状态管理是管理应用程序数据的过程。作为开发者，确保数据在应用的不同部分之间保持一致和同步至关重要。 你将首先学习如何在 React Native 中使用状态（state）和属性（props）来实现状态管理，并仅通过 React Native 内置方案构建一个真实的 Funbook 应用。接着，你将了解 Redux 和 MobX 两个库，以及如何利用它们在应用中实现点赞按钮功能。然后，你将使用 XState 库来实现点赞按钮，该库将状态视为有限状态机。你还将学习 Jotai 库，它采用原子化状态进行状态管理。最后，你将掌握 React Query 如何提供便捷的服务器端数据获取与数据变更操作，从而替代全局状态管理的需求。 完成本课程后，你将具备实现复杂状态管理功能的能力，确保应用各部分之间的数据一致性与同步。

13 Lessons
Included in Subscription Plan
Personalized Learning
Powered by AI
View Courses in Subscription
在 React Native 中简化状态管理
状态管理是管理应用程序数据的过程。作为开发者，确保数据在应用的不同部分之间保持一致和同步至关重要。 你将首先学习如何在 React Native 中使用状态（state）和属性（props）来实现状态管理，并仅通过 React Native 内置方案构建一个真实的 Funbook 应用。接着，你将...

WHAT YOU'LL LEARN

熟悉 React Native 的核心组件，包括状态、属性、钩子和上下文

Content

13 Lessons • 0 Quizzes • 0 Challenges

开始之前
  1. 1

    概览

  2. 2

    课程结构

什么是 React 和 React Native？
  1. 1

    概览

  2. 2

    ReactJS 的发展历史 ReactJS 最初由 Facebook（现 Meta）的工程师 Jordan Walke 于 2011 年开发，最初是为了解决 Facebook 新闻流中动态内容更新带来的性能问题。它基于 JavaScript 和虚拟 DOM 技术，能够高效地更新用户界面。 2013 年，Facebook 正式开源了 React，并迅速在前端开发社区中获得广泛认可。其组件化架构和声明式编程风格让开发者能够更轻松地构建复杂的用户界面。 2015 年，React Native 发布，使开发者能够使用 React 构建原生移动应用，进一步扩展了 React 的适用范围。 2017 年，React 16 版本发布，引入了“Fiber”渲染器，显著提升了性能，支持错误边界、异步渲染和更好的服务器端渲染能力。 2018 年，React Hooks 被引入，允许函数组件使用状态和生命周期功能，极大简化了代码逻辑，成为 React 开发的核心特性之一。 2020 年，React 17 发布，标志着 React 从对旧版浏览器的支持转向现代浏览器环境，同时为未来版本的升级铺平道路。 2022 年，React 18 推出，带来了自动批处理、并发渲染、新的根 API 和改进的服务器组件支持，使应用响应更快、用户体验更流畅。 如今，React 已成为全球最流行的前端框架之一，被众多知名公司用于构建高性能、可维护的 Web 应用。

  3. 3

    ReactJS 组件基础

  4. 4

    React Native

  5. 5

    总结：React 与 React Native

  6. 6

    测验：React 与 React Native

设置示例应用与开发环境
  1. 1

    设置示例应用程序

在简单 React 应用中管理状态
  1. 1

    概览

  2. 2

    什么是状态，它与属性有什么不同？

  3. 3

    什么是有状态组件和无状态组件？

  4. 4

    我们应该了解哪些 Hooks？

  5. 5

    社交媒体应用结构

  6. 6

    摘要：在简单 React 应用中管理状态

  7. 7

    测验：在简单的 React 应用中管理状态

规划和设置 Funbook 应用
  1. 1

    概览

  2. 2

    规划所需的界面和组件

  3. 3

    在应用程序中规划数据流

  4. 4

    熟悉应用的预览与调试

  5. 5

    总结：创建一个真正可用的应用程序

  6. 6

    测验：创建一个真正可用的应用程序

样式设计与内容填充 Funbook 应用
  1. 1

    概览

  2. 2

    创建和美化动态信息流界面

  3. 3

    创建并设置对话界面的样式

  4. 4

    为应用程序获取数据

  5. 5

    挑战：构建个人资料页面

  6. 6

    解决方案：构建个人资料页面

  7. 7

    摘要：应用的样式设置与内容填充

  8. 8

    测验：为 Funbook 应用程序添加样式和填充内容

在我们的 Funbook 应用中实现 Redux
  1. 1

    概览

  2. 2

    什么是 Redux？

  3. 3

    Redux 核心概念

  4. 4

    向应用中添加 Redux 功能

  5. 5

    组合各种全局状态

  6. 6

    利用 Redux Toolkit 创建动作

  7. 7

    摘要：在 Funbook 应用中实现 Redux

  8. 8

    测验：在我们的 Funbook 应用中实现 Redux

在 React Native 应用中使用 MobX 作为状态管理工具
  1. 1

    概览

  2. 2

    MobX 概念与配置

  3. 3

    使用 MobX 管理收藏图片

  4. 4

    创建 Store

  5. 5

    获取数据

  6. 6

    添加操作

  7. 7

    从状态中获取数据

  8. 8

    摘要：在 React Native 应用中使用 MobX 作为状态管理工具

  9. 9

    测验：在 React Native 应用中使用 MobX 作为状态管理器

使用 XState 梳理 React Native 复杂流程
  1. 1

    概览

  2. 2

    什么是有限状态机？

  3. 3

    在 Funbook 应用中配置 XState

  4. 4

    使用 XState 管理“已收藏图片”界面的状态

  5. 5

    获取图像数据

  6. 6

    管理图像模态框中的图片

  7. 7

    喜欢图片

  8. 8

    摘要：使用 XState 解析复杂的状态流转

  9. 9

    测验：使用 XState 理解复杂流程

在 React Native 应用中集成 Jotai
  1. 1

    概览

  2. 2

    什么是 Recoil 和原子状态？

  3. 3

    在 Funbook 应用中配置和使用 Jotai

  4. 4

    使用 Jotai 获取数据

  5. 5

    向 ImageListAtom 函数添加读写功能

  6. 6

    摘要：在 React Native 应用中集成 Jotai

  7. 7

    测验：在 React Native 应用中集成 Jotai

使用 React Query 实现服务器端驱动的状态管理
  1. 1

    概览

  2. 2

    什么是 React Query？

  3. 3

    使用 React Query 进行数据获取

  4. 4

    其他 React Query 功能

  5. 5

    摘要：使用 React Query 进行服务器端驱动的状态管理

  6. 6

    测验：使用 React Query 进行服务器端驱动的状态管理

结论
  1. 1

    结语

附录
  1. 1

    环境设置

  2. 2

    重要链接

  3. 3

    重要对话

Certificate of Completion

Showcase your accomplishment by sharing your certificate of completion.

Course Author:Anonymous User

Reviews

Read reviews from students who have taken this course and share your own experience.

Reviews & Comments (0)