reactjs - 如果 Context API 不持久,为什么还要使用它?

标签 reactjs react-hooks

这更多的是出于好奇,但是如果 Context API 不在刷新时保留数据,那么使用它有什么意义呢?我知道我们可以使用 localStorage 来修复持久性,但是为什么不直接使用 localStorage 呢?使用 Redux,您仍然遇到同样的问题,因此您使用中间件来解决这个问题。我确信我在这里遗漏了一些东西,但我最近一直在处理 Context,当它在开发过程中不断刷新时,它让我发疯。

最佳答案

Redux 的最佳且最容易被忽视的替代方案之一是 React 自己的内置 Context API

Context API 提供了一种不同的方法来解决 React 深层嵌套组件之间的数据流问题。 React 中的 Context 已经存在很长一段时间了,但自诞生以来它已经发生了巨大的变化。直到 16.3 版本,它是一种在 React 组件树之外处理状态数据的方法。这是一项实验性功能,不推荐用于大多数用例。

最初,遗留上下文的问题是,如果组件通过 shouldComponentUpdate 生命周期方法跳过渲染,那么对通过上下文传递的值的更新可能会被“阻止”。由于许多组件依赖 shouldComponentUpdate 进行性能优化,因此遗留上下文对于传递纯数据毫无用处。

新版本的Context API是一种依赖注入(inject)机制,允许通过组件树传递数据,而无需在每个级别手动向下传递 Prop 。

这里最重要的是,与 Redux 不同,Context API 不是一个状态管理系统。相反,它是一种依赖注入(inject)机制,您可以在其中管理 React 组件中的状态。当与 useContextuseReducer 钩子(Hook)一起使用时,我们得到了一个状态管理系统。

了解更多信息的下一步是阅读 Andy Fernandez 撰写的这篇文章,其中深入探讨了 Context APIRedux 之间的差异:Context API vs Redux: Managing Data Flow Through Nested Components in React

关于reactjs - 如果 Context API 不持久,为什么还要使用它?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67182109/

相关文章:

node.js - 在 Electron 应用程序中启用硬件加速

reactjs - React Native 应用程序在从 Xcode 运行时可以工作,但在使用 'react-native run-ios' 运行时会崩溃

javascript - 未捕获的不变违规 : Rendered more hooks than during the previous render

javascript - React 函数高阶组件

javascript - React Hooks useEffect 不会使用正确的状态

javascript - 使用 React 和 Express

javascript - 从另一个数组返回部分数组 Javascript ES6 语法

reactjs - React Hooks-如何从查询字符串获取参数值

javascript - 为什么 React 状态没有在函数内部更新?

javascript - React-Bootstrap 与 ButtonGroup 出现问题或在哪里放置模态?