Languages
[Edit]
PL

React - AJAX - metoda POST

0 points
Created by:
Dirask JS Member
3430

W tym artykule chcieliby┼Ťmy pokaza─ç, jak wykona─ç ┼╝─ůdanie POST┬áw Reakcie .

W poniższym przykładzie zastosowano metodę fetch z dwoma parametrami:

  • ┼Ťcie┼╝k─ů┬ádo logiki backendu znajduj─ůcej si─Ö na serwerze,
  • konfiguracj─ů┬á┼╝─ůdania, kt├│ra pozwala nam skonfigurowa─ç: metod─Ö, nag┼é├│wek, tre┼Ť─ç ┼╝─ůdania itp.

W poni┼╝szym przyk┼éadzie u┼╝yli┼Ťmy metody┬áPOST, kt├│ra pozwala na przes┼éanie pewnych danych w tre┼Ťci.

Praktyczny przykład:

// ONLINE-RUNNER:browser;

// import React from 'react';

const Form = () => {
  const handleSubmit = async (e) => {
    e.preventDefault();
    const elements = e.target.elements;
    const requestData = {
      username: elements.username.value,
      password: elements.password.value,
    };
    const requestJson = JSON.stringify(requestData);
    try {
      const response = await fetch("/path/to/backend", {
        method: "POST",
        body: requestJson,
      });
      const responseText = await response.text();
      console.log(responseText);
    } catch (ex) {
      console.error("POST - b┼é─ůd!");
    }
  };
  return (
    <form onSubmit={handleSubmit}>
      <div>
        <label>Nazwa u┼╝ytkownika: </label>
        <input type="text" name="username" />
      </div>
      <div>
        <label>Hasło: </label>
        <input type="password" name="password" />
      </div>
      <div>
        <input type="submit" value="Zatwierd┼║!" />
      </div>
    </form>
  );
};

const root = document.querySelector("#root");
ReactDOM.render(<Form />, root);

ReactJS (PL)

React - AJAX - metoda POST
Native Advertising
­čÜÇ
Get your tech brand or product in front of software developers.
For more information Contact us
Dirask - we help you to
solve coding problems.
Ask question.

ÔŁĄ´ŞĆ­čĺ╗ ­čÖé

Join