背景与介绍
React Native 是一种移动端开发框架，可以使用 React 语言和思想来开发 iOS 和 Android 应用。RESTful API 表示一个在 Web 应用程序中，以标准化方式进行交互的软件设计风格和规范。本篇文章将介绍如何使用 React Native 开发 RESTful API，以便您可以为您的 React Native 应用程序提供后端数据。
步骤概述
- 安装 React Native
- 安装所需的模块包
- 创建 RESTful API
- 直接使用 JavaScript
- 使用 Node.js 和 Express 库
- 向后端发送请求
- 将数据返回到 React Native 前端
安装 React Native
为了使用 React Native，您需要安装 Node.js 和 NPM。您也需要安装 React Native 命令行工具。具体步骤可以参考 React Native 的官网。
安装所需的模块包
您需要安装 Axios 和 Native-Base 安装包。Axios 是一个用于 HTTP 请求的 JavaScript 库。Native-Base 是一个用于构建 React Native 应用程序的 UI 库。可以使用 npm 包管理器安装这些包。
npm i axios native-base
创建 RESTful API
您可以使用纯 JavaScript 或 Node.js 和 Express 库来创建 RESTful API。在这篇文章中，我们将使用后者。
在项目文件夹中创建一个名为 server.js 的新文件，然后将以下代码添加到其中。
-- -------------------- ---- -------
----- ------- - ------------------
----- --- - ---------
----- ---- - ----
------------ ----- ---- -- -
----------
-------- ------ -------
--
--
---------------- -- -- -
------------------- ------- --- ---------------------------
--运行以下代码启动服务器：
node server.js
打开浏览器，访问 http://localhost:4000/，您应该能看到 {"message":"Hello World!"}。
服务端请求格式
RESTful API 遵循一些标准请求格式，包括以下。
| HTTP 动词 | 描述 |
|---|---|
| GET | 从服务器获取数据 |
| POST | 在服务器上创建新数据 |
| PUT | 在服务器上更新数据（整个对象） |
| PATCH | 在服务器上更新数据（部分对象） |
| DELETE | 从服务器删除数据 |
向后端发送请求
使用 Axios 库可以从 React Native 应用程序向服务器发送请求，并获取数据。
import axios from 'axios';
axios.get('http://localhost:4000/')
.then(response => console.log(response.data))
.catch(error => console.log(error))这将在控制台打印 {"message":"Hello World!"}。
将数据返回到 React Native 前端
你可以使用 setState 函数将数据返回到 React Native 前端。
-- -------------------- ---- -------
----- --- ------- --------- -
------------------ -
-------------
---------- - - -------- -- --
-
------------------- -
-----
------------------------------
-------------- -- -
--------------- -------- --------------------- ---
--
------------ -- -
-------------------
---
-
-------- -
------ -
----- -------------------------
----- ---------------------------------------------
-------
--
-
-现在，在你的 React Native 应用程序中，你可以看到 Hello World! 的文本。 如果您想传递更多参数，您可以通过 URL 字符串传递它们。
总结
在本篇文章中，我们介绍了使用 React Native 开发 RESTful API 的步骤。我们还使用 Express 库来创建服务器和 Axios 库来发送请求。最后，我们将响应数据返回到 React Native 前端。如果你想要更深入的信息，请查看 React Native 的官方文档。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64f456ccf6b2d6eab3d64d74