第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

如何將 ReactJS 中的應(yīng)用狀態(tài)傳遞給后端?

如何將 ReactJS 中的應(yīng)用狀態(tài)傳遞給后端?

慕工程0101907 2022-09-29 16:48:55
我正在使用 ReactJS 開(kāi)發(fā)一個(gè) Web 應(yīng)用程序,在其中我創(chuàng)建了一個(gè)窗體,并將所有輸入字段的值存儲(chǔ)到應(yīng)用程序的狀態(tài)中。也就是說(shuō),我的 App.js 文件的狀態(tài)包含在 Form.js 文件中創(chuàng)建的所有輸入字段的值。我希望將存儲(chǔ)在狀態(tài)中的信息傳遞到后端,以便我可以基于它處理數(shù)據(jù)集。如何添加功能,以便在單擊提交按鈕時(shí),處于應(yīng)用狀態(tài)的所有內(nèi)容都將傳遞到后端 - 例如文本文件或 json 文件中。基本上,我想根據(jù)用戶在表單中提供的信息(使用ReactJS)搜索數(shù)據(jù)集(使用彈性搜索)。我是 React 的新手,所以我沒(méi)有太多的知識(shí)。我已經(jīng)制作了Web應(yīng)用程序,但我需要有關(guān)如何將通過(guò)表單獲得的信息傳遞到后端的建議,以便我可以做進(jìn)一步的工作。
查看完整描述

4 回答

?
千巷貓影

TA貢獻(xiàn)1829條經(jīng)驗(yàn) 獲得超7個(gè)贊

如何添加功能,以便在單擊提交按鈕時(shí),處于應(yīng)用狀態(tài)的所有內(nèi)容都將傳遞到后端 - 例如文本文件或 json 文件中。

您可以使用 Axios 或獲取 API 請(qǐng)求在應(yīng)用程序中使用的數(shù)據(jù)。您可以使用兩種最流行的方法(稱為 Axios(基于承諾的 HTTP 客戶端)和提取 API(瀏覽器內(nèi)置的 Web API))來(lái)使用 REST API。

獲取() API 是一種內(nèi)置的 JavaScript 方法,用于從服務(wù)器或 API 端點(diǎn)獲取資源。它類似于 XML 請(qǐng)求

Axios 是一個(gè)易于使用的基于承諾的 HTTP 客戶端,適用于瀏覽器和節(jié)點(diǎn).js。由于 Axios 是基于承諾的,我們可以利用異步并等待更多可讀性和異步代碼。借助 Axios,我們獲得了攔截和取消請(qǐng)求的能力,它還具有內(nèi)置功能,可提供客戶端保護(hù),防止跨站點(diǎn)請(qǐng)求偽造。

要了解更多信息,您可以參考

  • 以上這兩種方法,都可以用于將數(shù)據(jù)從前端提交到后端,以便將數(shù)據(jù)存儲(chǔ)到后端,然后您可以根據(jù)需要對(duì)其執(zhí)行多個(gè)操作。

您可以參考多個(gè)博客和文檔來(lái)了解更多信息:

使用公理從 ReactJS 中的 API 中獲取數(shù)據(jù)

用于開(kāi)機(jī)自檢請(qǐng)求的獲取 API

阿克西奧斯

公理和獲取 API 之間的區(qū)別

最近,我還創(chuàng)建了一個(gè)應(yīng)用程序,其中我將 React 與彈簧靴應(yīng)用程序集成。

在此應(yīng)用程序中。我已經(jīng)設(shè)置了路由器和路由,創(chuàng)建并提交了表單,稱為獲取,發(fā)布,PUT,使用axios刪除請(qǐng)求(也完成了獲取API)。

submitBook= event =>{

event.preventDefault();

const book = {


         title:  this.state.title,

         author: this.state.author,

         coverphotoURL: this.state.coverphotoURL,

         isbnNumber: this.state.isbnNumber,

         price: this.state.price,

         language: this.state.language


};


const headers = new Headers();

headers.append("Content-Type", "application/json");


fetch("http://localhost:8080/rest/books",{

method:"POST",

body:JSON.stringify(book),

headers

})

.then(response => response.json())

.then((book) => {

if(book){

this.setState({"show":true, "method":"post"});

setTimeout(() => this.setState({"show":false}),3000);


}

else{

this.setState({"show":false});


}});

this.setState(this.initialState);

};

要查看完整代碼,您可以參考我的Github存儲(chǔ)庫(kù)


查看完整回答
反對(duì) 回復(fù) 2022-09-29
?
拉莫斯之舞

TA貢獻(xiàn)1820條經(jīng)驗(yàn) 獲得超10個(gè)贊

您需要研究制作XHR或使用獲取API(或axio)向后端API發(fā)出http請(qǐng)求。


查看完整回答
反對(duì) 回復(fù) 2022-09-29
?
慕絲7291255

TA貢獻(xiàn)1859條經(jīng)驗(yàn) 獲得超6個(gè)贊

您可能希望使用 MDN 中記錄的獲取 API。它處理網(wǎng)址請(qǐng)求,包括通過(guò)HTTP解析數(shù)據(jù)的REST API,例如 JSON對(duì)象等。


查看完整回答
反對(duì) 回復(fù) 2022-09-29
?
繁花如伊

TA貢獻(xiàn)2012條經(jīng)驗(yàn) 獲得超12個(gè)贊

使用公理來(lái)調(diào)用您在后端定義的 api 網(wǎng)址。您可以在youtube上觀看簡(jiǎn)短的教程以熟悉基礎(chǔ)知識(shí)。


查看完整回答
反對(duì) 回復(fù) 2022-09-29
  • 4 回答
  • 0 關(guān)注
  • 108 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)