2020 年你应该知道的 React 库(3)

时间：2020-03-02 08:13 来源：网络整理作者：网络浏览：次收藏挑错推荐打印

您可以像其他 web 运用顺序一样部署和托管 React 运用顺序。假设你想拥有完全的控制权，选择像Digital Ocean这样的。假设你希望有人来处置一切的事情，假设你曾经在运用第三方的身份验证/数据库，Netlify 是一个很受欢迎的处置方案，比如 Firebase，你可以反省他们能否也提供主机效劳(比如 Firebase Hosting)。您还可以运用 S3的静态站点与 Cloudfront 一同托管。

React 测试

假设您想深化了解 React 中的测试，请阅读以下内容: How to test components in React。要点如下: 测试 React 运用顺序的主干是 Jest。它提供了测试运转顺序、断言库和监视(spying)/模拟(mocking)/stubbing 功用，一个片面的测试框架中需求的一切东西。

至少，您可以运用 React-test-renderer 在 Jest 测试中渲染 React 组件。这曾经足以用 jest 来执行所谓的快照测试了。快照测试的任务方式如下: 运转测试之后，将创立 React 组件中渲染的 DOM 元素的快照。当您在某个时间点再次运转测试时，将创立另一个快照，用作前一个快照的差异。假设 diff 不完全相反，则 Jest 将报错，您要么必须接受快照，要么必须更改组件的完成。

最终，您会发现本人在运用 Enzyme 或 React Testing Library (这两个都在 Jest 测试环境中运用)来停止更详细的测试功用集。这两个库使得在 HTML 元素上出现组件和模拟事情成为能够。然后，Jest 用于 DOM 节点上的断言。

假设您正在为 React-to-end (E2E)测试寻觅测试工具，Cypress 是最受欢迎的选择。

建议:

Unit/Integration/Snapshot Tests: Jest + React Testing Library

E2E Tests: Cypress 2e test: Cypress

用于 React 的工具库

Javascript 为处置数组、对象、数字、对象和字符串提供了少量内置功用。 React 中最常用的 JavaScript 内置功用之一是内置 map() 数组。为什么？由于您总是必须出现组件中的列表。由于 JSX 是 HTML 和 JavaScript 的混合物，所以您可以运用 JavaScript 在数组上停止映射并前往 JSX。运用 React 创立列表组件变得复杂:

const List = ({ list }) => <div> {list.map(item => <div key={item.id}>{item.title}</div>)} </div>

但是，您能够需求选择一个适用顺序库来提供更详细的功用。您甚至能够希望在将这些适用函数链接起来时愈加灵敏，甚至可以将它们静态地组合在一同。这时，您将引入一个适用顺序库: Lodash 或 Ramda。关于每一个 JavaScript 开发者来说，Lodash 是一个愈加实践的库，而 Ramda 在函数式编程中有一个弱小的中心。请记住，现代 JavaScript 提供了很多开箱即用的特性，如今运用适用顺序库的必要性曾经降低了。

建议:

JavaScript

Lodash

react 和不可变的数据机构

原生 JavaScript 提供了少量内置工具来处置数据结构，就像它们是不可变的一样。但是，假设您和您的团队以为有必要实施不可变的数据结构，最盛行的选择之一是 Immer。就我团体而言，我不运用它，但是任何时分有人问到 JS 中的不变性(immutability)，大家都会指出 Immer，并且这可以加上 redux 或 React hooks。

React 国际化

当触及到 React 运用顺序的国际化时，您不只需求思索翻译，还需求思索多元化、日期和货币的格式化，以及其他一些事项。以下是最受欢迎的处置该成绩的库:

react-i18next

react-intl

LinguiJS

FBT

建议:

react-i18next

React 富文本编辑器

当触及到在 React 中的富文本编辑器时，我只能想到以下内容，由于我没有在 React 中运用任何其他内容:

Draft.js

Slate