简介
Expressa 是一个快速搭建 REST API 的工具，而 expressa-client 是 Expressa 的一个 npm 包，用于在前端中使用 Expressa（ REST API ）提供的接口。本篇文章主要介绍如何使用 expressa-client 包在前端中使用 Expressa。
安装
我们可以使用 npm 安装 expressa-client:
npm install expressa-client
安装完成后，就可以在代码中使用该包了。
使用
创建实例
在使用 expressa-client 的接口之前，我们需要先创建一个 expressa-client 的实例。在创建实例时，需要指定 Expressa 的 API 地址，代码如下：
-- -------------------- ---- -------
-- -- --------------- -
------ - -------------- - ---- ------------------
-- -- -------------- --
----- -------------- - --- ----------------
-------- ------------------------ -- -------- - --- --
-------- -
-- ---- ----
-------------- ------- -----------
--
---其中，baseURL 为 Expressa API 的地址，headers 为认证相关的头部信息。
使用接口
创建完 expressaClient 实例后，我们就可以来使用它提供的各个接口了。这里只列举一下常用的几个接口：
查询数据
expressaClient.get('/<collection-name>').then((res) => {
console.log(res.data);
});查询单条数据
expressaClient.get('/<collection-name>/<object-id>').then((res) => {
console.log(res.data);
});创建数据
expressaClient.post('/<collection-name>', {
data: {
/* 数据内容 */
},
}).then((res) => {
console.log(res.data);
});更新数据
expressaClient.patch('/<collection-name>/<object-id>', {
data: {
/* 数据内容 */
},
}).then((res) => {
console.log(res.data);
});删除数据
expressaClient.delete('/<collection-name>/<object-id>').then((res) => {
console.log(res.data);
});示例
我们来用一个例子演示如何使用 expressa-client 查询数据，并在页面上展示出来。假设我们需要查询一个学生名单列表，在页面上展示出来。后端数据结构如下：
{
"_id": "5fcac1f5dc13de00298204a8",
"name": "小明",
"age": "12",
"gender": "男"
}前端代码如下：
-- -------------------- ---- -------
------ - -------------- - ---- ------------------
----- -------------- - --- ----------------
-------- ------------------------
---
-- --------------
------------------------------------------ -- -
----- - ---- - - ----
----- ----- - --------------------------------
--------------- - -
-------
----
-----------
-----------
-----------
-----
--------
--
----- ----- - --------------------------------
------------------- -- -
----- -- - -----------------------------
------------ - -
---------------------
--------------------
-----------------------
--
-----------------
---
--------------------
----------------------------
---注意事项
使用 expressa-client 需要注意以下几点：
- 在使用接口时需要注意对应的请求方式以及参数格式。
- 在实例化 expressa-client 时，需要指定正确的 baseURL 以及认证相关的头部信息。
- 在使用 expressa-client 查询数据时，需要注意控制查询的数据量，避免查询过多而导致性能问题。
总结
本篇文章主要介绍了如何使用 npm 包 expressa-client，在前端中使用 Expressa 提供的接口。我们通过一个简单的示例代码演示了如何使用 expressa-client 查询数据，并在页面上展示出来。希望这篇文章能够帮助到大家。
参考链接
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005626281e8991b448dfad1