在 React Native 中，发送 HTTP 请求是一项常见的任务。在许多情况下，我们需要向服务器发送表单数据。这时候，x-www-form-urlencoded 就是一个标准的格式。
x-www-form-urlencoded 是什么？
x-www-form-urlencoded 是一种编码方式，用于将表单数据编码为 URL 参数。例如，假设我们有以下表单：
------
-------
-----
------ ----------- ------------
--------
----
-------
------
------ ------------ -------------
--------
----
------- -----------------------------
-------当用户提交该表单时，浏览器会将数据编码为以下字符串：
--------------------------------------
这里的 name 和 email 是表单输入框的名称，John Doe 和 john@example.com 是用户输入的值。
在 React Native 中发送 x-www-form-urlencoded 请求
要在 React Native 中发送 x-www-form-urlencoded 请求，可以使用 fetch 函数。该函数返回一个 Promise 对象，可以通过 .then() 和 .catch() 方法来处理响应和错误。
首先，我们需要将表单数据编码为 x-www-form-urlencoded 格式。这可以使用 URLSearchParams 对象实现：
----- ------ - --- ------------------ --------------------- ----- ------ ---------------------- -------------------- ----- ---- - ------------------
现在，我们可以使用 fetch 函数发送请求：
----------------------------------- -
------- -------
-------- -
--------------- -----------------------------------
--
----- ----
--
-------------- -- ----------------
---------- -- ------------------
------------ -- ----------------------这里的第一个参数是 URL，第二个参数是一个对象，用于配置请求。我们将 method 设置为 POST，headers 指定了请求头部信息，将 Content-Type 设置为 application/x-www-form-urlencoded，以通知服务器数据格式。最后，将编码后的表单数据作为请求体 (body) 发送。
示例代码
下面是一个完整的例子，演示如何在 React Native 中发送 x-www-form-urlencoded 请求：
------ ------ - -------- - ---- --------
------ - ----- ---------- ------ - ---- ---------------
------ ------- -------- ----- -
----- ------ -------- - -------------
----- ------- --------- - -------------
----- ------------ - -- -- -
----- ------ - --- ------------------
--------------------- ------
---------------------- -------
----- ---- - ------------------
----------------------------------- -
------- -------
-------- -
--------------- -----------------------------------
--
----- ----
--
-------------- -- ----------------
---------- -- ------------------
------------ -- ----------------------
--
------ -
------
----------
------------------
------------
----------------------
--
----------
-------------------
-------------
-----------------------
--
------- -------------- ---------------------- --
-------
--
-在这个例子中，我们创建了两个输入框，用于输入名字和电子邮件。当用户点击提交按钮时，将会发送一个 x-www-form-urlencoded 请求到 https://example.com/submit 并输出响应数据。
总结
在 React Native 中发送 x-www-form-urlencoded 请求非常简单。只需要使用 URLSearchParams 对象编码表单数据，并将其作为请求体 (body) 发送到服务器即可。通过这种方式，您可以轻松地向服务器发送表单数据并处理响应。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/27578