如何知道我是否应该为我的应用程序或任何其他替代方案使用redux？ - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

设计师都能懂的 Redux 指南

阅读本文大约需要 10 分钟作者：来源 sf 的小智你知道 Redux 真正的作用远不止状态管理吗？你是否想要了解 Redux 的工作原理？...有时候 React 中的内置功能运行得足够好。但随着应用程序变得越来越复杂，仅凭React 可能会更难管理它的状态。这就是为什么许多人开始使用Redux作为替代。...使用 Redux，我们可以将任何数据插入任何组件，而不影响其他组件，就像这样更准确地说，实际上是另一个叫做 react-redux 的库将数据提供给组件的，而并非 Redux 本身。...真正可扩展的系统使用 Redux，你必须“dispatch”一个 action 来更新应用程序中的任何数据。这种限制使我们可以深入了解应用程序中发生的各个方面。...人们一直在抱怨他们必须用 Redux 编写的样板代码。我知道，这听起来很矛盾。我不是说 Redux 能够用最少的代码实现功能吗？这有点像使用洗碗机。首先，你得花时间仔细地排列盘子。

1.7K1 0

从设计的角度看 Redux

你知道 Redux 真正的作用远不止状态管理吗？你是否想要了解 Redux 的工作原理？让我们深入研究 Redux 可以做什么，它为什么做它的事情，它的缺点是什么，以及它与设计有哪些关联？...有时候 React 中的内置功能运行得足够好。但随着应用程序变得越来越复杂，仅凭React 可能会更难管理它的状态。这就是为什么许多人开始使用Redux作为替代。...使用 Redux，我们可以将任何数据插入任何组件，而不影响其他组件，就像这样更准确地说，实际上是另一个叫做 react-redux 的库将数据提供给组件的，而并非 Redux 本身。...真正可扩展的系统使用 Redux，你必须“dispatch”一个 action 来更新应用程序中的任何数据。这种限制使我们可以深入了解应用程序中发生的各个方面。...人们一直在抱怨他们必须用 Redux 编写的样板代码。我知道，这听起来很矛盾。我不是说 Redux 能够用最少的代码实现功能吗？这有点像使用洗碗机。首先，你得花时间仔细地排列盘子。

1.7K3 0

您找到你想要的搜索结果了吗？

是的

没有找到

在线教育直播源码中React库的特性解读

当涉及到远程数据的状态管理时，如果远程数据带有GraphQL端点，我建议使用ApolloClient。ApolloClient的替代方案是urql和Relay。　　...如果远程数据不是来自GraphQL端点，请尝试使用React的Hooks来管理它。如果不行，像Redux或者MobX/MobxStatetree这样的解决方案可能会有所帮助。　　...一旦您的应用程序增长，还有许多其他样式方案选择。首先，我建议您研究一下CSSModules，将其作为CSS-in-CSS解决方案之一。...作为一个函数式的 CSS 解决方案: 1.4.png 　是否选择CSSinCSS、CSSinjs或函数式CSS取决于您。...如果您有足够的时间来处理GraphQLAPI，我建议您使用ApolloClient。可供选择的GraphQL客户端将是urql或Relay。

1.4K4 0

2020 年你应该知道的 React 库

Apollo Client 的替代方案是 urql 和 Relay。如果远程数据不是来自 GraphQL 端点，请尝试使用 React 的 Hooks 来管理它。...一旦您的应用程序增长，还有许多其他样式方案选择。首先，我建议您研究一下 CSS Modules，将其作为 CSS-in-CSS 解决方案之一。...就我个人而言，我不使用它，但是任何时候有人问到 JS 中的不变性(immutability)，大家都会指出 Immer，并且这可以加上 redux 或 React hooks。...，我只能想到以下内容，因为我没有在 React 中使用任何其他内容: Draft.js Slate React 中的支付和其他网络应用一样，最常见的支付提供商是 Stripe 和 PayPal。...我已经广泛地使用了 Storybook，我可以说他非常好用，但是我也听说了其他解决方案的好处: Styleguidist docz Docusaurus 总结所以最终，React 生态系统可以看作是一个

14.4K4 0

如何在 React 应用中使用 Hooks、Redux 等管理状态

在 Redux 中，store 是拥有所有应用程序状态信息的实体。多亏 Redux，我们能够从任何想要的组件中访问 store（就像使用 context 一样）。...对于 Redux，要解决的问题是处理全局状态（指影响整个应用程序或其中很大一部分的状态）。用 Redux 来处理像我们的例子中的计数器或模态的打开和关闭是没有意义的。...Redux 的替代品如果这个主题对你来说还不够复杂，在过去的几年里，出现了许多作为 Redux 替代品的新的库，每个库都有自己的状态管理方法。为了获得很好的概述，让我们快速了解它们。...不过，作为开发者，我们必须牢记，Redux 和其他库的创建是为了解决特定的状态管理问题，特别是在真正的大型、复杂和大量使用的应用程序中。...但就我们目前所看到的而言，其中一个或一些带头成为更广泛使用的工具似乎只是时间问题。我希望你喜欢这篇文章并学到了一些新东西。干杯，下次见！

8.5K2 0

关于微服务和 Java 需要知道的 5 件事

这篇文章将给出 Java 对现代应用程序（包括微服务）仍有很大价值的一些理由。以下是您应该知道的关于微服务和 Java 的 5 件事： 1.为什么我应该用 Java 编写微服务？...3.我应该如何打包 Java 微服务？微服务应用程序应包含部署所需的一切资源。...相反，有两种选择：已打包服务器或容器。已打包服务器可以是可执行的 JAR 或 zip 文件，这无关紧要。该数据包应包含应用程序、任何依赖项和应用服务器。...服务发现解决方案（比如 Netflix Eureka、Consul 或 Amalgam8）很容易与 Java 微服务关联起来。...您会发现，在测试微服务时使用模拟对象非常有用，JMockit 和 Mockito 简化了模拟对象的创建。 5.我是否需要在 Java 中编写所有应用程序？不需要，您不应该为了使用它而使用它。

5943 0

“别更新了，学不动了” 之：全栈开发者 2019 应该学些什么？

Vue 3.0 2018 年，Vue 持续获得开发者的青睐，2019 年将会继续增长……但它是否足以超越其他两大玩家？我们拭目以待。...现在，我可以使用 Angular 创建世界上最好的组件，并将它交给我的朋友，她将它用在她的 React 应用程序中！...新的 Context API、Redux 和 GraphQL Apollo 内置的离线客户端缓存将使 Apollo + GraphQL 在 2019 年成为 Redux 的一个重要替代品（当然，从技术上讲...HTTP2 HTTP2 变得越来越普遍，你需要知道如何使用这个协议来优化内容的传输。此外，HTTP3 正在开发当中，你可以关注它，但它并不是你在 2019 年需要过分关注的东西。...集成测试：测试流程或组件是否按预期运行（包括副作用）。端到端测试：测试用户的实际行为，不仅仅是测试一个简单的功能。

2.6K3 0

ReactJS和React-Native的主要区别在哪里

它看似CSS,但却不是真正的CSS.这可能一开始会令人困惑，你可能会碰到一个问题，比如你想知道如何使用SASS来创建混合，或者如何覆盖要重用的组件的样式。...幸运地是，你很有可能找到可替代方案完成你所需。...，我想知道如何在2个场景之间导航栏切换。...然后，我开始想知道导航切换是如何工作的，我发现了React-Native提供的Navigator组件。我应该从这开始，寻找一个替代的react-router在我看来不是最好的做法。 ?...甚至可以使用伟大的Redux DevTools来检查Redux存储的状态。可是我最想要的一个功能是检查DOM，就像在网页上一样，本地检查器绝对没有那么好。

17K3 0

【React】211- 2019 React Redux 完全指南

本教程不仅涵盖视频中的所有内容，还有其他干货。你应该用 Redux 吗？都 9102 年了，弄清楚你是否还应该十分必要使用 Redux。...现在有更好的替代品出现吗，使用 Hooks，Context 还是其他库？简而言之：即使有很多替代品，Redux 仍旧不死。但是是否适用于你的应用，还得看具体场景。超级简单？...如果你想深入研究 Context API，看我在 egghead 的课程 React Context 状态管理其他替代品：使用 children Prop 取决于你构建应用程序的方式，你可能会用更直接的方式把数据传递给子组件...点击了解如何使用 Immer。建议：如果你是开始一个全新的应用程序，一开始就使用 Immer。它会为你省去很多麻烦。...我有时也依旧会忘记。如何使用 React Redux mapDispatchToProps 现在你知道 action 生成器是什么，我们可以讨论又一个级别的抽象。（我知道，我知道。这是可选的。）

4.3K2 0

2022 年的 React 生态

它允许你管理应用程序的全局状态，任何连接到其全局存储的 React 组件都可以读取和修改这些状态。如果你碰巧在用 Redux，你一定也应该查看 Redux Toolkit。...它是基于 Redux 的一个很棒的 API，极大地改善了开发者使用 Redux 的体验。...作为替代方案，如果你喜欢用全局存储的思想管理状态，但不喜欢 Redux 的处理方式，可以看看其他流行的本地状态管理解决方案，例如 Zusand、Jotai、XState 或 Recoil 。...建议：用 useState/useReducer 处理共享状态选择性使用 useContext 管理某些全局状态用 Redux(或另一种选择) 管理全局状态链接： Redux：https://redux.js.org...无论它是 dropdown、radio button 还是 checkbox ，你最终都应该知道如何创建这些UI组件组件。

5.8K2 0

Angular React Vue我应该选择什么？

那么我们如何选择使用哪个框架呢？列出他们的优劣是极好的。我们将按照先前文章的方式去做，“共有 9 步：为 Web 应用选择一个技术栈”。在开始之前 —— 是否应用单页 Web 应用开发？...那么我们如何选择使用哪个框架呢？列出他们的优劣是极好的。我们将按照先前文章的方式去做，“共有 9 步：为 Web 应用选择一个技术栈”。在开始之前 —— 是否应用单页 Web 应用开发？...我觉得使用 Google 和微软强大支持的产品会更舒服。另外（...）与我的背景，我知道微软对 TypeScript 有更宏伟的蓝图。 emmmmmmmm.........对于复杂度不大的应用程序，就不必定义的状态流了，像原生 JS 就足够了。它是如何工作的？组件在任何时间点描述 UI。当数据改变时，框架重新渲染整个 UI 组件 - 显示的数据始终是最新的。...RealWorld 创建了一个真实世界的应用程序（中仿），他们已经准备好了 Angular（4+）和 React（带 Redux ）的解决方案。Vue 的开发正在进行中。

2.9K2 0

2023 React 生态系统，以及我的一些吐槽……

可惜的是他仅仅列出了名字，没有继续深入介绍，我知道读者们有很多小懒蛋，那我就花点时间收集一些重点框架的详细介绍，如果我有一些看法（吐槽），我也会在下面的引用部分进行一些评价。...首先，服务器状态具有以下特点：以你无法控制或拥有的远程位置持久存储需要使用异步 API 进行获取和更新暗示共享所有权，并且可能被其他人在你不知情的情况下更改如果不小心处理，可能会在应用程序中变得...根据我们的先知 Dan Abramov 的说法，表单状态本质上是短暂且局部的，因此在 Redux（或任何 Flux 库）中跟踪它是不必要的。...对于小型应用程序来说这没问题，但如果您使用 Redux-Form，随着 Redux 应用程序的增长，输入延迟将继续增加。...不是因为我认为 React 在实现表单方面采取了错误的方法，而是因为在使用 React 时，表单是最具挑战性的问题。许多框架都有自己的解决方案来处理表单。AngularJS 在这方面做得非常好。

7853 0

「前端架构」使用React进行应用程序状态管理

React是管理应用程序状态所需的全部内容管理状态可以说是任何应用程序中最难的部分。这就是为什么有这么多的状态管理库可用，而且每天都有更多的库出现（甚至有些库是建立在其他库之上的。。。...这就是我只在一个项目中使用redux的原因：我经常看到开发人员把他们所有的状态都放到redux中。不仅是全局应用程序状态，还包括本地状态。...将所有应用程序状态都放在一个对象中也会导致其他问题，即使您没有使用Redux。当一个反应获取一个新值，使用该值的所有组件都将更新并必须呈现，即使它是只关心部分数据的函数组件。...如何将数据导入每个提供程序取决于这些提供程序使用的钩子以及如何在应用程序中检索数据，但您知道从何处开始查找（在提供程序中）如何工作。...Recoil和jotai非常相似（并且解决了相同类型的问题）。但根据我和他们的（有限）经验，我更喜欢jotai。无论如何，大多数应用程序都不需要像recoil或jotai这样的原子状态管理工具。

2.9K3 0

React组件设计模式-纯组件，函数组件，高阶组件

虽然值已经被改变，但是子组件比较的是之前props的引用是否相同，所以不会检测到不同。因此，你可以通过使用es6的assign方法或者数组的扩展运算符或者使用第三方库，强制返回一个新的对象。... 当组件是独立的，组件在页面中的个数为1或2的，组件有很多props、state，并且当中还有些是数组和对象的，组件需要每次都渲染的，使用Component 当组件经常作为子组件，作为列表，...（3）约定：包装显示名称以便轻松调试HOC创建的容器组件会与任何其他组件一样，会显示在 React Developer Tools 中。为了方便调试，请选择一个显示名称，以表明它是 HOC 的产物。...但是，当你将 HOC 应用于组件时，原始组件将使用容器组件进行包装。这意味着新组件没有原始组件的任何静态方法。...这个问题的解决方案是通过使用 React.forwardRef API（React 16.3 中引入）参考React实战视频讲解：进入学习三、React Redux 的 connectReact Redux

2.2K2 0

在使用Redux前你需要知道关于React的8件事

.但它只能扩展到具体某一个组件.React仅仅是一个视图层库.最终你决定(把状态管理)迁移到一个更为成熟的解决方案,如Redux.接下来我想在这篇文章中指出在跳上Redux的列车前,你应该了解清楚的有关...,通常情况下你不需要Redux这样的状态管理库.学习React之路一书中演示了如何使用普通的React构建应用程序,而不需要用到Redux这样的外部依赖....但是,子组件并不知道Props中的函数的来源或功能.这些函数可以更新父组件的State,也可能是执行其他操作.同样的道理,子组件也不知道它所接收的Props是来自父组件的Props,State或其他派生属性...React上下文(Context) React的Context上下文很少被使用,我不会建议去使用它,因为Context API并不稳定,而且使用它还UI增加应用程序的复杂性.不过尽管如此,还是很有必要理解它的功能的...,才需要去扩展状态管理的解决方案.也许提取State或使用React Context应用提供者模式(provider pattern)就可以解决你的问题了.

1.2K8 0

React组件设计模式之-纯组件，函数组件，高阶组件

虽然值已经被改变，但是子组件比较的是之前props的引用是否相同，所以不会检测到不同。因此，你可以通过使用es6的assign方法或者数组的扩展运算符或者使用第三方库，强制返回一个新的对象。... 当组件是独立的，组件在页面中的个数为1或2的，组件有很多props、state，并且当中还有些是数组和对象的，组件需要每次都渲染的，使用Component 当组件经常作为子组件，作为列表，...（3）约定：包装显示名称以便轻松调试HOC创建的容器组件会与任何其他组件一样，会显示在 React Developer Tools 中。为了方便调试，请选择一个显示名称，以表明它是 HOC 的产物。...但是，当你将 HOC 应用于组件时，原始组件将使用容器组件进行包装。这意味着新组件没有原始组件的任何静态方法。...这个问题的解决方案是通过使用 React.forwardRef API（React 16.3 中引入）三、React Redux 的 connectReact Redux 的 connect 函数是一个

2.3K3 0

2018年前端流行哪些技术？

在熟悉了基本的 Redux, Redux-saga, Redux-router 的使用之后，可以尝试用 dva 替代） Webpack – 前端构建工具用到的其他类库，技术选择和工具前端开发我在用到的其他类库...我还用它实现了无限滑动的效果。还有一个非常流行的 swiper（ nolimits4web/swiper ），但是我没有用过。不知道跟 Alloy touch 的区别。...我主要是在 Node.js 中使用 Axios，替代了 request；浏览器中还是使用 Fetch API，还没有在浏览器中尝试使用 Axios。...我倾向于还是使用 npm，搞清楚 npm 的常用 script；搞清楚npm install 时候依赖安装的流程，以及 package-lock 的作用；能维护和发布自己的 npm 包；知道 npx 是干什么的就可以了...React Native/Flutter – 跨端方案。最近关于 RN 是否凉了？如何评价 Flutter？

2.6K1 0

代码审查如何保证软件质量

测试的主要目的不是检查代码，而是检查应用程序是否正常运行。测试包括检测应用程序不同层中是否存在任何错误，应用程序是否满足涉众的所有要求并确保将检测到的问题传达给相关团队。...在很小的应用程序中，如果有多个审阅者仔细地检查代码，他们可能会确定执行单元测试时可能引起缺陷的部分。仅假设，不现实。手动或自动化测试通常采用固定方法来检查应用程序流，并确定是否有任何异常的行为。...这就是测试起作用的地方。但是，测试不能以假设或现实的方式代替代码审查。尽管测试可以检测到所有错误并由开发人员修复它们，但让我们讨论一个方案，该方案将清楚说明为什么它不能代替代码审查。...提出诸如“我是否知道此代码在做什么？”或“此代码是否符合客户指定的编码标准？”之类的问题，这被认为是审查最佳实践的最佳代码，您可以轻松地准备要检查的项目。...两者都将检测到不同的问题，同时最终将影响整个应用程序的设计。在任何需要的地方自动化：应该手动检查代码中的某些内容。还有其他一些事情，可以使用适当的工具进行检查。在您不需要手动干预的地方实现自动化。

1K1 0

「前端架构」Redux vs.MobX的权威指南

在这篇文章中，我们将研究每个库以及它们是如何匹配的。本文假设您对web应用程序中的状态管理工作有一个基本的了解。普通JavaScript和Redux框架都适用于普通或不可知的框架。...以这种方式分离存储区的好处是，您也可以在其他应用程序中重用该域。UI存储将特定于当前应用程序。获奖者：Redux 这个类别的赢家是主观的；这取决于开发者的偏好。...我个人喜欢将应用程序的整个状态存储在单个存储中的想法。这有助于我把同一个地方称为真理的唯一来源。有些人可能会说多家商店对他们更有效，更喜欢MobX。...数据结构 Redux Redux使用普通JavaScript对象作为数据结构来存储状态。使用Redux时，必须手动跟踪更新。在需要维护大量状态的应用程序中，这可能更困难。...它没有任何副作用或来自外界的影响。 Redux函数使用以下模式编写。reducer是接受一个状态和动作并返回一个新状态的纯函数。

1.6K3 0

Medium网友开发了一款应用程序让学习算法和数据结构变得更有趣

我觉得我必须比其他人(他们有天生的数学能力)更努力地学习相同的概念。这个想法深深扎根在我的大脑中，我很确定我永远无法学习像“二叉搜索树”这样的东西，以及如何在精神上分析像“归并排序”这样的递归噩梦。...这款无需注册的应用程序可以自动保存你的进度，当你困住的时候为你提供解决方案，还会提供一些有用的文章、教程和其他资源的链接，让你的学习过程变得更加轻松！我承认，这款应用并不是什么开创性的东西。...在过去的18个月左右，我可以自信地说我已经学会了如何编码。尽管我仍然不愿自称为程序员。通过学习CS的基本原理，我希望不仅能对自己作为一名程序员更有信心，而且还能帮助其他人。...持久化代码我想让这个应用程序超级容易使用。...因此，我选择了一种更简单的方法来保存进度，而不是实现数据库并请求用户登录。Redux在每个会话期间管理应用程序的状态，我使用localStorage来在会话中持久化代码。

1.5K5 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭