扩展 Algolia 的小部件

概述

在本节课中，我们将学习如何使用 Algolia 的第二层 API 来扩展 InstantSearch 组件，这将提供与之前相同的功能，同时允许我们自定义 DOM 的渲染方式。

为此，我们将创建一个与前几章所构建的搜索组件不同的新组件，以演示如何扩展 Algolia 的组件。

默认情况下，Algolia 的 InstantSearch 组件由以下两部分组成：

1. 业务逻辑代码
2. 渲染代码

其中，业务逻辑部分由高阶组件（HOC）实现的连接器（connectors）构成。

高阶组件（HOC）是一个接收组件并返回新组件的函数。

连接器是我们将用于扩展组件的 API 实现。它们使我们能够以任意方式扩展现有组件。

此外，每个组件都对应一个连接器，反之亦然，二者之间存在一一映射关系。每当需要扩展某个组件时，都必须使用对应的连接器。

渲染代码则是我们传递给连接器的组件，连接器会将其作为参数，并返回一个扩展后的组件。

点击 运行 按钮，然后在终端中输入 npm start 查看输出结果。